@import url("reset.css");
@import url("sidebar.css");
@import url("product.css");
@import url("company.css");
@import url("service.css");

@font-face {
    font-family: 'iconfont';
    src: url('//at.alicdn.com/t/font_2376849_p9p90dcxuba.eot');
    src: url('//at.alicdn.com/t/font_2376849_p9p90dcxuba.eot?#iefix') format('embedded-opentype'), url('//at.alicdn.com/t/font_2376849_p9p90dcxuba.woff2') format('woff2'), url('//at.alicdn.com/t/font_2376849_p9p90dcxuba.woff') format('woff'), url('//at.alicdn.com/t/font_2376849_p9p90dcxuba.ttf') format('truetype'), url('//at.alicdn.com/t/font_2376849_p9p90dcxuba.svg#iconfont') format('svg');
}

body {
    overflow-x: hidden;
}

.businessList {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.icon {
    width: 32px;
    height: 34px;
    vertical-align: -0.15em;
    fill: currentColor;
}

.ceshi:before {
    content: "\e678";
    color: rebeccapurple;
    font-family: "iconfont";
    display: inline-block;
}

.arrondiBox {
    overflow: auto;
    position: absolute;
    left: 70px;
    right: 0;
    top: 0;
    bottom: 0;
    min-width: 1200px;
}

.arrondiLeft {
    position: absolute;
    width: 260px;
    background: #fff;
    top: 0;
    bottom: 0;
    overflow: auto;
}

.arrondiName {
    margin: 10px 10px 10px 20px;
    height: 50px;
    overflow: hidden;
}

.arrondiName .fl {
    width: 50px;
    height: 50px;
    border-radius: 8px;
    overflow: hidden;
}

.arrondiName .fl .img {
    display: table-cell;
    width: 48px;
    height: 48px;
    vertical-align: middle;
    text-align: center;
    border: 1px solid rgba(234, 237, 243, 0.6);
    overflow: hidden;
    border-radius: 10px;
}

.arrondiName .fl img {
    max-width: 48px;
    max-height: 48px;
    vertical-align: middle;
}

.arrondiName .fr {
    width: 165px;
    padding: 0;
    float: inherit;
    padding-left: 12px;
    height: 50px;
    display: table-cell;
    vertical-align: middle;
    overflow: hidden;
}

.arrondiName h3 {
    font-size: 18px;
    color: #222;
    line-height: 25px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    text-overflow: ellipsis;
    overflow: hidden;
    vertical-align: middle;
    width: 165px;
    word-break: break-all;
}

.arrondiName p {
    font-size: 14px;
    color: #999;
    line-height: 18px;
    height: 18px;
    overflow: hidden;
    display: none;
}

.arrondiNav {
    overflow: hidden;
    padding: 0 15px;
    margin-bottom: 20px;
    border-bottom: 1px solid #eaedf3;
    border-top: 1px solid #eaedf3;
}

.arrondiNav li {
    height: 24px;
    padding: 12px;
    border-bottom: 1px solid #eaedf3;
}

.arrondiNav li:last-child {
    border-bottom: 0;
    height: 25px;
}

.arrondiNav li a {
    display: flex;
    height: 24px;
}

.arrondiNav li a:hover {
    opacity: 0.85;
}

.arrondiNav li em {
    display: block;
    font-size: 20px;
    font-family: "iconfont";
}

.arrondiNav li em.ico1::after {
    content: "\e669";
    color: #f54244;
}

.arrondiNav li em.ico2::before {
    content: "\e66a";
    color: #3591fc;
}

.arrondiNav li em.ico3::before {
    content: "\e665";
    color: #5ec344;
}

.arrondiNav li em.ico4::before {
    content: "\e664";
    color: #ed3e01;
}

.arrondiNav li p {
    padding-left: 12px;
    color: #222;
    line-height: 24px;
    font-size: 14px;
}

.arrondiNav li span {
    color: #999;
}

.channelCon {
    overflow: hidden;
}

.channelCon .list {
    display: block;
}

.channelCon .tit {
    height: 34px;
    font-size: 14px;
    color: #999;
    overflow: hidden;
    line-height: 34px;
    padding: 3px 0 3px 24px;
}

.channelCon .tit em {
    display: block;
    width: 16px;
    height: 34px;
    float: left;
    background: url(//style.org.hc360.com/images/chat/icon.png) 0 -117px;
}

.channelCon .tit em.arrow {
    background-position: -25px -117px;
}

.channelCon .tit a {
    color: #999;
    display: block;
}

.channelCon dd {
    overflow: hidden;
    height: 34px;
    position: relative;
    padding: 3px 0;
}

.channelCon dd a {
    padding: 0 0 0 40px;
    display: block;
    line-height: 34px;
    font-size: 14px;
    color: #222;
}

.channelCon dd.cur a,
.channelCon dd a:hover {
    background: #f2f2f2;
}

.channelCon dd a span {
    color: #999;
    margin-right: 5px;
}

.channelCon dd em {
    height: 14px;
    background: #ed0011;
    display: inline-block;
    border-radius: 15px;
    padding: 0 2px;
    color: #fff;
    font-size: 12px;
    line-height: 14px;
    width: 15px;
    text-align: center;
    margin-left: 8px;
}

.channeltit {
    overflow: hidden;
    background: #f1f1f5;
    height: 70px;
    padding: 0 30px;
    font-size: 18px;
    color: #222;
    line-height: 70px;
    border-bottom: 1px solid #eaedf3;
}

.channeltit span {
    font-size: 14px;
    color: #999;
}

.arrondiRig,
.chatRig {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 260px;
    border-left: 1px solid #eaedf3;
    background: #fbfbfd;
    min-width: 800px;
    overflow: auto;
}

.chatBox {
    position: absolute;
    top: 71px;
    right: 230px;
    bottom: 0;
    left: 0;
    padding: 30px 0 0;
    border-right: 1px solid #eaedf3;
}

.chatCon {
    overflow: auto;
    padding: 15px 30px;
    bottom: 230px;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
}

.chatCon .userinfo {
    margin-bottom: 12px;
    height: 28px;
}

.chatCon .right .userCon .fl,
.chatCon .left .userCon .fl {
    margin-right: 12px;
    position: relative;
}

.userinfo .userImg {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    overflow: hidden;
    vertical-align: middle;
    text-align: center;
    display: table-cell;
    border: 1px solid rgba(234, 237, 243, 0.6);
    cursor: pointer;
}

.userinfo .userImg img {
    max-width: 26px;
    max-height: 26px;
    vertical-align: middle;
}

.chatCon .userinfo p {
    float: left;
    line-height: 28px;
}

.chatCon .userinfo p.name {
    font-size: 14px;
    color: #222;
    margin-right: 10px;
}

.chatCon .userinfo p.date {
    font-size: 12px;
    color: #999;
}

.chatCon .left,
.chatCon .right {
    padding: 15px 0;
}

.chatCon .con {
    max-width: 70%;
    background: #fff;
    padding: 15px 24px;
    font-size: 14px;
    color: #222;
    line-height: 24px;
    border: 1px solid #eaedf3;
    float: left;
}

.chatCon .right .userCon,
.chatCon .right .con {
    float: right;
}

.chatCon .right .con {
    border-radius: 8px 0 8px 8px;
    background: #f5f5f7;
    border: 0;
    color: #3e3f42;
}

.writingArea {
    height: 230px;
    border-top: 1px solid #eaedf3;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: #fff;
    z-index: 10;
}

.writingArea textarea {
    height: 110px;
    width: 100%;
    border: 0;
    padding: 20px 30px;
    box-sizing: border-box;
    resize: none;
    font-size: 16px;
}

.writingArea p {
    position: absolute;
    bottom: 20px;
    right: 100px;
    font-size: 12px;
    color: #989898;
}

.writingCon button {
    position: absolute;
    bottom: 20px;
    right: 20px;
    background: #ed0011;
    width: 72px;
    height: 32px;
    font-size: 15px;
    color: #fff;
    border: 0;
    border-radius: 5px;
}

.memberBox {
    background: #fff;
    position: absolute;
    right: 0;
    top: 71px;
    bottom: 0;
    width: 230px;
}

.memberCon {
    height: auto;
    position: absolute;
    padding: 20px 10px 20px 20px;
    top: 0;
    left: 0;
    bottom: 0;
    width: 200px;
    overflow: auto;
}

.memberCon .onLine,
.group .tit {
    line-height: 30px;
    color: #999;
    font-size: 14px;
    margin-bottom: 8px;
}

.group {
    overflow: hidden;
    margin-bottom: 8px;
}

.group li {
    padding: 6px;
    height: 38px;
}

.group .userInfo {
    width: 38px;
    height: 38px;
    float: left;
    position: relative;
}

.group .userInfo .img {
    width: 36px;
    height: 36px;
    display: table-cell;
    border-radius: 50%;
    text-align: center;
    overflow: hidden;
    margin-right: 16px;
    vertical-align: middle;
    border: 1px solid rgba(234, 237, 243, 0.6);
}

.group .userInfo img {
    max-width: 36px;
    max-height: 36px;
    vertical-align: middle;
}

.group .userInfo em {
    display: block;
    background: #cbcccf;
    border-radius: 50%;
    border: 2px solid #fff;
    position: absolute;
    bottom: -2px;
    right: 0;
    width: 8px;
    height: 8px;
}

.group .userInfo em.on {
    background: #3bad4b;
}

.group li p.name {
    color: #3e3f42;
    float: left;
    padding-left: 12px;
    line-height: 38px;
    font-size: 14px;
    max-width: 85px;
    height: 38px;
    overflow: hidden;
    word-break: break-all;
}

.group li p.label {
    color: #c7cdd8;
    float: left;
    margin-left: 10px;
    font-size: 12px;
    max-width: 124px;
    border: 1px solid #eaedf3;
    padding: 0 5px;
    height: 16px;
    line-height: 16px;
    margin-top: 10px;
}

.memberCon::-webkit-scrollbar,
.chatCon::-webkit-scrollbar,
.chatListCon::-webkit-scrollbar,
.chatProList::-webkit-scrollbar,
.writingArea textarea::-webkit-scrollbar,
.arrondiChannel::-webkit-scrollbar,
.arrondiLeft::-webkit-scrollbar {
    width: 4px
}

.memberCon::-webkit-scrollbar-track,
.chatCon::-webkit-scrollbar-track,
.chatListCon::-webkit-scrollbar-track,
.chatProList::-webkit-scrollbar-track,
.writingArea textarea::-webkit-scrollbar-track,
.arrondiChannel::-webkit-scrollbar-track,
.arrondiLeft::-webkit-scrollbar-track {
    background: #fff;
    -webkit-border-radius: 2em;
    -moz-border-radius: 2em;
    border-radius: 2em
}

.memberCon::-webkit-scrollbar-thumb,
.chatCon::-webkit-scrollbar-thumb,
.chatListCon::-webkit-scrollbar-thumb,
.chatProList::-webkit-scrollbar-thumb,
.writingArea textarea::-webkit-scrollbar-thumb,
.arrondiChannel::-webkit-scrollbar-thumb,
.arrondiLeft::-webkit-scrollbar-thumb {
    background: #b7b7b7;
    -webkit-border-radius: 2em;
    -moz-border-radius: 2em;
    border-radius: 2em
}

.chatContent .chatBox {
    right: 0;
}

.chatTit .userInfo,
.chatListCon .userInfo {
    width: 38px;
    height: 38px;
    float: left;
    position: relative;
}

.chatTit .userInfo .img,
.chatListCon .userInfo .img {
    width: 36px;
    height: 36px;
    display: table-cell;
    border-radius: 50%;
    text-align: center;
    overflow: hidden;
    margin-right: 16px;
    vertical-align: middle;
    border: 1px solid rgba(234, 237, 243, 0.6);
}

.chatTit .userInfo img,
.chatListCon .userInfo img {
    max-width: 36px;
    max-height: 36px;
    vertical-align: middle;
}

.chatTit .userInfo em,
.chatListCon .userInfo em {
    display: block;
    background: #cbcccf;
    border-radius: 50%;
    border: 2px solid #fff;
    position: absolute;
    bottom: -2px;
    right: 0;
    width: 8px;
    height: 8px;
}

.chatTit .userInfo em.on,
.chatListCon .userInfo em.on {
    background: #3bad4b;
}

.chatTit {
    overflow: hidden;
    background: #f1f1f5;
    height: 38px;
    padding: 16px 30px;
    font-size: 18px;
    color: #222;
    border-bottom: 1px solid #eaedf3;
    position: relative;
}

.chatTit p {
    float: left;
    line-height: 38px;
    margin-left: 15px;
}

.chatList {
    position: absolute;
    left: 0;
    width: 260px;
    top: 0;
    bottom: 0;
    height: 100%;
    background: #fff;
}

.chatList .tit {
    height: 70px;
    line-height: 70px;
    padding: 0 23px;
    font-size: 18px;
    color: #222;
    border-bottom: 1px solid #eaedf3;
    background: #fff;
}

.chatListCon {
    position: absolute;
    left: 0;
    top: 71px;
    right: 0;
    overflow: auto;
    bottom: 0;
}

.chatListCon li {
    overflow: hidden;
    padding: 12px;
    border-bottom: 1px solid #eaedf3;
    cursor: pointer;
}

.chatListCon li.cur {
    background: #f2f2f2;
}

.chatListCon a {
    display: block;
}

.chatListCon dl {
    padding-left: 48px;
}

.chatListCon dt {
    overflow: hidden;
    height: 24px;
    line-height: 24px;
    position: relative;
}

.chatListCon dd {
    font-size: 13px;
    height: 14px;
    line-height: 15px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #999;
}

.chatListCon .name {
    font-size: 15px;
    float: left;
    padding-right: 26px;
    max-width: 94px;
    position: relative;
    word-break: break-all;
    height: 24px;
    overflow: hidden;
}

.chatListCon .date {
    float: right;
    text-align: right;
    font-size: 12px;
    color: #999;
    white-space: nowrap;
    letter-spacing: -0.2px;
    position: absolute;
    top: 0;
    right: 0;
}

.chatListCon .name em {
    height: 14px;
    background: #ed0011;
    display: inline-block;
    border-radius: 15px;
    padding: 0 2px;
    color: #fff;
    font-size: 12px;
    line-height: 14px;
    width: 15px;
    text-align: center;
    margin-left: 3px;
    vertical-align: middle;
    margin-top: -5px;
    position: absolute;
    right: 5px;
    top: 9px;
}

.chatContent {
    position: absolute;
    top: 0;
    left: 70px;
    right: 0;
    bottom: 0;
    min-width: 1200px;
}

.chatCon .left .con {
    border-radius: 0 8px 8px 8px;
}

@media screen and (max-width: 1450px) {
    .chatCon .con {
        max-width: 60%;
    }
}

.commodityBox {
    position: absolute;
    top: 71px;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 14px 0;
    border-right: 1px solid #eaedf3;
    overflow: auto;
}

.commodityCon {
    width: auto;
}

.arrondiNav li.cur {
    background: #f2f2f2;
    padding: 13px 32px 12px;
    margin: -1px -20px;
    border-bottom: 1px solid #fff;
    height: 25px;
}

.commodityCon .list.hover .contactBtn {
    top: 0;
    display: block;
}

.mallBox {
    overflow: auto;
    position: absolute;
    left: 70px;
    right: 0;
    top: 0;
    bottom: 0;
    min-width: 1080px;
}

.signCon {
    background: url(//style.org.hc360.com/images/chat/signBg.png) 100px no-repeat #f4f4f5;
    height: 78px;
    padding: 18px 30px 14px;
}

.vipTit em {
    float: left;
    display: block;
    width: 32px;
    height: 30px;
    margin-right: 3px;
}

.signCon .mmtVip {
    background-position: 0 -140px;
    width: 30px;
}

.signCon .mmtV2 {
    background-position: 0 2px;
}

.signCon .mmtV3 {
    background-position: 0 -44px;
}

.signCon .mmtV4 {
    background-position: -8px -90px;
}

.signCon h2 {
    font-size: 28px;
    color: #222;
    font-weight: bold;
    line-height: 48px;
}

.signCon .info {
    line-height: 30px;
    overflow: hidden;
}

.signCon .info p {
    font-size: 16px;
    margin-right: 25px;
}

.signCon .info .vipTit {
    font-size: 14px;
    color: #222;
}

.signCon .info .vipTit span {
    color: #f14b55;
    padding: 0 2px;
}

.signCon .info .icon {
    padding-top: 5px;
}

.signCon .info .icon a {
    display: block;
    float: left;
    margin-left: 8px;
    width: 18px;
    height: 20px;
    background: url(//style.org.hc360.com/images/chat/icon.png) no-repeat;
}

.signCon .info .icon a.bwIcon {
    background-position: 0 -261px;
}

.signCon .info .icon a.jinvIcon {
    background-position: 0 -282px;
}

.signCon .info .icon a.certificatesIcon {
    background-position: 0 -307px;
}

.mallCon {
    padding: 0 30px 30px;
    left: 0;
    right: 0;
    bottom: 0;
    background: #fff;
}

.locationCon {
    height: 70px;
    line-height: 70px;
    font-size: 14px;
    color: #222;
}

.locationCon a {
    color: #999;
    text-decoration: none;
}

.locationCon span {
    padding: 0 5px;
}

.tabTit {
    background: #f1f1f5;
    line-height: 48px;
    height: 48px;
    margin-bottom: 30px;
    border: 1px solid #eaedf3;
    border-radius: 6px;
    overflow: hidden;
}

.tabTit a {
    display: block;
    float: left;
    font-size: 16px;
    color: #222;
    width: 120px;
    text-align: center;
}

.tabTit a.cur {
    color: #fff;
    background: #222;
}

.companyProfile {
    padding: 25px 18px 5px;
    border: 1px solid #eaedf3;
    border-radius: 6px;
}

.informationBox .con {
    padding: 25px 12px;
    overflow: hidden;
}

.informationBox table {
    border-top: 1px solid #ddd;
    border: 1px solid #eaedf3;
    border-bottom: 0;
    font-size: 14px;
    line-height: 24px;
    border-radius: 6px;
}

.informationBox table th {
    padding: 15px 0;
    text-align: center;
    color: #656565;
    width: 15%;
    border-bottom: 1px solid #eaedf3;
    font-weight: normal;
    background: #f7f7f8;
}

.informationBox table td {
    padding: 15px 30px;
    color: #222;
    border-bottom: 1px solid #eaedf3;
    word-break: break-all;
    width: 35%;
}

.informationBox table td a {
    text-decoration: none;
    color: #333;
}

.informationBox table td a:hover {
    color: #ee2e2c;
}

.informationBox table td span {
    float: right;
    color: #999;
}

.companyProfile .tit {
    height: 18px;
    border-left: 5px solid #ed0011;
    padding-left: 12px;
    line-height: 18px;
    position: relative;
    margin: 5px 12px 0 0;
}

.companyProfile .tit h3 {
    float: left;
    font-size: 18px;
    color: #222;
    width: 105px;
}

.companyProfile .tit p {
    height: 8px;
    border-bottom: 1px solid #eaedf3;
    position: absolute;
    left: 117px;
    right: 0;
}

.surveyBox .con {
    line-height: 28px;
    font-size: 14px;
    color: #656565;
    padding: 25px 17px;
    margin-bottom: 10px;
}

.detailInfo {
    overflow: hidden;
    background: #fff;
    margin-bottom: 50px;
}

.detailLeft {
    width: 806px;
}

.pro-big-img {
    display: table-cell;
    width: 500px;
    height: 500px;
    text-align: center;
    vertical-align: middle;
    border: 1px solid #eaedf3;
}

.pro-small-img {
    width: 500px;
    height: 92px;
    position: relative;
}

.pro-small-img .left-arrow {
    position: absolute;
    top: 9px;
    left: -20px;
    width: 20px;
    height: 50px;
    background: url(../images/icon.png) 8px -273px no-repeat;
    cursor: pointer;
}

.pro-small-img .right-arrow {
    position: absolute;
    top: 9px;
    right: -20px;
    width: 20px;
    height: 68px;
    height: 50px;
    background: url(../images/icon.png) 6px -304px no-repeat;
    cursor: pointer;
}

.small-con {
    width: 416px;
    height: 92px;
    overflow: hidden;
    margin-top: 20px;
    position: relative;
    margin: 20px auto 0;
}

.pro-small-img ul {
    width: 104%;
    position: absolute;
    top: 0;
    left: 0;
}

.pro-small-img li {
    width: 90px;
    height: 90px;
    float: left;
    border: 1px solid #eaedf3;
    margin: 0 6px;
}

.pro-small-img li a {
    display: table-cell;
    width: 90px;
    height: 90px;
    text-align: center;
    vertical-align: middle;
}

.pro-small-img li img {
    max-width: 90px;
    max-height: 90px;
    vertical-align: middle;
}

.detailInfo .fr {
    float: none;
    padding: 25px 0 0 532px;
}

.detailInfo .fr .price {
    color: #ed0011;
    font-size: 30px;
    line-height: 50px;
    margin-bottom: 22px;
}

.detailInfo .fr h2 {
    font-size: 20px;
    font-weight: 500;
    color: #222;
    line-height: 28px;
    margin-bottom: 20px;
}

.detailInfo .fr dd {
    line-height: 30px;
    overflow: hidden;
    font-size: 14px;
    margin-bottom: 12px;
}

.detailInfo .fr dd span {
    width: 88px;
    float: left;
    color: #999;
    white-space: nowrap;
}

.detailInfo .fr dd span.letter2 {
    letter-spacing: 28px;
}

.detailInfo .fr dd span.letter3 {
    letter-spacing: 7px;
}

.detailInfo .fr dd p {
    width: 358px;
    float: left;
    color: #222;
}

.detailInfo .fr dd p.price {
    color: rgba(247, 85, 89, 1);
}

.detailInfo .fr a.inquiry-btn {
    display: block;
    width: 110px;
    height: 38px;
    line-height: 38px;
    text-align: center;
    background: url(//style.org.hc360.com/images/chat/icon.png) 24px -219px #ed0011;
    border-radius: 4px;
    font-size: 15px;
    color: #fff;
    margin: 50px 0 0 88px;
    padding-left: 20px;
}

.complete-info {
    line-height: 20px;
    text-align: right;
    padding-top: 18px;
}

.complete-info a {
    color: rgba(30, 35, 48, 0.66);
    font-size: 14px;
}

.detail-intro {
    margin-bottom: 24px;
    background: #fff;
    overflow: hidden;
}

.detail-intro .title,
.store-info .title,
.detail-pro-hot .title {
    color: #1F1F1F;
    font-size: 20px;
    line-height: 50px;
    padding: 0 22px;
    border-bottom: 1px solid #f5f5f5;
}

.detail-intro .title h3,
.store-info .title h3,
.detail-pro-hot .title h3 {
    font-size: 20px;
    color: #1F1F1F;
}

.detail-con {
    width: 710px;
    margin: 0 auto;
}

.detail-con img {
    max-width: 710px;
}

.detail-con p {
    padding: 10px 0;
    overflow: hidden;
    line-height: 24px;
    color: rgba(30, 35, 48, 0.66);
    font-size: 14px;
}

.pro-small-img a.leftArrow,
.pro-small-img a.rightArrow {
    background: url(//style.org.hc360.com/images/chat/icon.png) 6px -304px no-repeat;
    display: block;
    width: 36px;
    height: 92px;
    position: absolute;
    top: 0;
}

.pro-small-img a.leftArrow {
    background-position: 0 -340px;
    left: 0;
}

.pro-small-img a.rightArrow {
    background-position: -36px -340px;
    right: 0;
}

.cg-table-con {
    border-spacing: 1px;
    width: 100%;
    font-size: 12px;
    background: #eaedf3;
    float: left;
    border-collapse: separate;
}

.cg-table .amount-cont {
    width: 200px;
    margin-left: -1px;
}

.cg-table-con th {
    background: #fff;
    color: #222;
    padding: 0;
    text-align: center;
    height: 40px;
    font-size: 14px;
    font-weight: normal;
}

.cg-table-con tr,
.cg-table-con td {
    text-align: center;
    font-size: 14px;
    color: #222;
    background: #fff;
    padding: 0px;
    width: 33.333%;
}

.cg-table-con tr .del-line {
    text-decoration: line-through;
    color: #999;
}

.cg-table-con td {
    height: 40px;
}

.orderInfo {
    padding-left: 88px;
    max-width: 600px;
}

.detailIntroduce {
    overflow: hidden;
    border: 1px solid #eaedf3;
    padding: 0 30px 30px;
    border-radius: 6px;
}

.detailIntroduce .top {
    overflow: hidden;
    padding: 25px 0;
}

.detailIntroduce .top h3 {
    font-size: 16px;
    color: #222;
    margin: 0 10px 10px;
}

.detailIntroduce .top li {
    width: 25%;
    float: left;
    line-height: 30px;
    color: #222;
    font-size: 14px;
    position: relative;
}

.detailIntroduce .top li span {
    width: 85px;
    float: left;
    color: rgba(30, 35, 48, 0.44);
    margin-right: 10px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.detailIntroduce .top li p {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 150px;
    padding-left: 95px;
    position: absolute;
    top: 0;
}

.detailIntroduce .con {
    padding: 0;
}

.detailIntroduce .con h3.tit {
    color: rgba(0, 0, 0, 0.8);
    font-size: 14px;
    line-height: 16px;
    margin: 6px 0 32px;
}

.detailIntroduce .top ul {
    margin: 0 10px;
}

.detailIntroduce .con img {
    max-width: 1000px;
    display: block;
    margin: 0 auto;
}

.detailIntroduce .con p {
    padding: 15px 0 5px;
    overflow: hidden;
    line-height: 24px;
    color: #222;
    font-size: 14px;
}

.nav a:hover {
    background: #3b3b3f;
}

.personalTit {
    height: 60px;
    padding: 0 40px;
    background: #f3f3f3;
}

.personalTit h3 {
    float: left;
    font-size: 18px;
    color: #222;
    line-height: 60px;
}

.personalTit .fr a {
    margin-left: 33px;
    display: block;
    float: left;
    height: 30px;
    line-height: 30px;
    color: #999;
    font-size: 14px;
}

.personalTit a.set-up {
    padding-left: 33px;
    color: #222;
    background: url(//style.org.hc360.com/images/chat/homeIcon.png) -177px -124px no-repeat;
}

.personalTit .fr {
    padding-top: 15px;
}

.personalTit .fr a:hover {
    color: #ed0011;
}

.personalCon {
    padding: 50px 40px;
    overflow: hidden;
}

.personalCon .txImg {
    overflow: hidden;
    height: 96px;
}

.txImg .updateCon {
    padding: 16px 0 0 37px;
}

.txImg .updateBtn {
    height: 38px;
    width: 75px;
    overflow: hidden;
    background: url(//style.org.hc360.com/images/chat/homeIcon.png) 0 -260px no-repeat;
    position: relative;
    font-size: 14px;
    color: #fff;
    padding-left: 50px;
    line-height: 38px;
}

.txImg .updateBtn input {
    position: absolute;
    top: 0;
    left: -120px;
    cursor: pointer;
    font-size: 24px;
    opacity: 0;
}

.txImg p {
    font-size: 14px;
    color: #999;
    line-height: 22px;
    padding-top: 15px;
}

.personalCon .name {
    height: 40px;
    padding: 42px 0 36px;
}

.personalCon .name p {
    width: 64px;
    height: 40px;
    float: left;
    text-align: center;
    line-height: 40px;
    color: #222;
}

.personalCon .name input {
    border: 1px solid #eaedf3;
    border-radius: 5px;
    width: 235px;
    height: 38px;
    padding: 0 0 0 15px;
    color: #222;
}

.personalCon button {
    display: block;
    background: #ee2626;
    width: 130px;
    height: 38px;
    border-radius: 5px;
    text-align: center;
    line-height: 30px;
    color: #fff;
    font-size: 14px;
    border: 0;
    margin-left: 64px;
}

.personalCon .headPortrait {
    width: 96px;
    height: 96px;
    border-radius: 50%;
    overflow: hidden;
    margin: 0 auto 10px;
}

.personalCon .headPortrait a {
    display: table-cell;
    width: 96px;
    height: 96px;
    text-align: center;
    vertical-align: middle;
}

.personalCon .headPortrait a img {
    max-height: 96px;
    max-width: 96px;
    vertical-align: middle;
}

.chatCon .list {
    float: right;
    position: relative;
    width: 220px;
    height: 280px;
    background: #fff;
    border-radius: 6px;
    overflow: hidden;
    margin: 0;
    box-shadow: 0px 5px 5px 1px #efeff1;
}

.chatCon .left .list {
    float: left;
}

.chatCon .left:after,
.chatCon .right:after,
.serviceBox .con:after,
.serviceBox .list:after,
.chatCon .userinfo:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden
}

/* .chatCon .left,.chatCon .right,.serviceBox .con,.serviceBox .list,.chatCon .userinfo {
    *+height: 1%;
} */

.writingTab {
    height: 58px;
    border-bottom: 1px solid #eaedf3;
    padding: 0 10px;
}

.writingTab li {
    width: 54px;
    height: 58px;
    float: left;
    background: url(//style.org.hc360.com/images/chat/homeIcon.png) no-repeat;
    position: relative;
    cursor: pointer;
}

.writingTab li.text {
    background-position: 17px -330px;
}

.writingTab li.pro {
    background-position: 16px -375px;
}

.writingTab li.text.cur {
    background-position: -32px -330px;
    background-color: #f2f2f2;
}

.writingTab li.pro.cur {
    background-position: -32px -375px;
    background-color: #f2f2f2;
}

.writingTab li .prompt {
    display: block;
    width: 45px;
    height: 20px;
    border-radius: 30px;
    text-align: center;
    line-height: 20px;
    font-size: 14px;
    color: #fff;
    background: #222;
    position: absolute;
    top: -20px;
    right: -3px;
}

.writingTab li .prompt em {
    display: block;
    width: 10px;
    height: 5px;
    position: absolute;
    left: 10px;
    bottom: -5px;
    background: url(//style.org.hc360.com/images/chat/homeIcon.png) no-repeat 0 -316px;
}

.writingCon {
    height: 171px;
    position: relative;
}

.chatProCon .search {
    height: 40px;
    position: relative;
    overflow: visible;
    width: 340px;
    margin: 0 auto 10px;
    background: #f7f7f7;
    border-radius: 30px;
}

.chatProCon .search input {
    border: none;
    float: left;
    text-align: left;
    font-size: 14px;
    height: 40px;
    background: none;
    width: 280px;
    padding-left: 20px;
}

.chatProCon .search button {
    position: absolute;
    top: 0;
    right: 0;
    background: url(//style.org.hc360.com/images/chat/homeIcon.png) -156px -256px no-repeat;
    width: 50px;
    height: 40px;
    line-height: 40px;
    color: #fff;
    border: 0;
}

.chatProCon {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 350px;
    right: 0;
    background: #fff;
    padding: 20px 0 0;
}

.chatProList {
    padding: 0px 20px;
    overflow: auto;
    height: 284px;
}

.chatProList li {
    width: 33.333%;
    float: left;
    padding: 10px 0;
}

.chatProList li .chatPro {
    margin: 0 10px;
    padding: 20px;
    border: 1px solid #eaedf3;
    border-radius: 6px;
    height: 80px;
    position: relative;
}

.chatPro .chatImg {
    width: 78px;
    height: 78px;
    float: left;
    border: 1px solid #eaedf3;
}

.chatPro dl {
    padding-left: 100px;
}

.chatPro dt {
    height: 40px;
    padding: 5px 0 0;
    line-height: 20px;
    font-size: 14px;
    overflow: hidden;
}

.chatPro dt a {
    color: #222;
}

.chatPro dt a:hover {
    color: #ed0011;
}

.chatPro dd {
    overflow: hidden;
    line-height: 28px;
    padding-top: 4px;
    height: 28px;
}

.chatPro .chatImg a {
    display: table-cell;
    width: 78px;
    height: 78px;
    vertical-align: middle;
    text-align: center;
}

.chatPro .chatImg img {
    max-width: 78px;
    max-height: 78px;
}

.chatPro dd a {
    float: right;
    display: block;
    width: 60px;
    height: 30px;
    color: #fff;
    background: #ed0011;
    border-radius: 4px;
    text-align: center;
    line-height: 30px;
    position: absolute;
    right: 20px;
}

.chatPro .price {
    font-size: 14px;
    color: #dd432f;
    margin-bottom: 10px;
    float: left;
}

.chatPro .price span {
    font-size: 20px;
    font-family: Arial;
    margin-left: 3px;
}

.chatBox.wPro .writingArea {
    height: 430px;
}

.chatBox.wPro .chatCon {
    bottom: 430px;
}

.chatRig .chatProList li {
    width: 33.333%
}

.headerBox {
    overflow: hidden;
    background: #fff;
    min-width: 1170px;
}

.portal li h3,
.portal li em,
.portalCon .arrow,
.purchaseCon dd.red,
.bottomLinkBox .arrow,
.releaseCon a,
.searchSele em,
.searchBox.bounce-out .fr a.addProduct,
.searchBox.bounce-out .fr a.addProcure,
.SearchWrap_cont .searchCon.bounce-out .fr a.addProduct,
.searchCon.bounce-out .fr a.addProcure {
    background: url(//style.org.hc360.com/images/homepage/2020/icon.png) no-repeat;
}

.appPortal {
    background: #fff;
    overflow: hidden;
}

.portalCon {
    position: relative;
    width: 1170px;
    margin: 0 auto;
    padding-bottom: 60px;
}

.portalCon:after,
.businessCon:after,
.businessList:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden
}

.portalCon,
.businessCon,
.businessList {
    width: 100%;
    display: flex;
    display: -webkit-flex;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.portalCon .title,
.businessCon .title {
    height: 75px;
    position: relative;
    margin-bottom: 40px;
    padding-top: 2px;
}

.portalCon .title h2,
.businessCon .title h2 {
    position: absolute;
    left: 0;
    top: 30px;
    z-index: 2;
    font-size: 30px;
    color: #222;
    line-height: 30px;
    font-weight: bold;
}

.portalCon .title h2 span,
.businessCon .title h2 span {
    color: #ed0011;
}

.portalCon .title p,
.businessCon .title p {
    font-size: 54px;
    color: #d8d8d8;
    line-height: 62px;
    opacity: 0.35;
    font-family: Arial;
}

.portalCon .title em,
.businessCon .title em {
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 2;
    display: block;
    width: 58px;
    height: 4px;
    background: #222;
}

.portal ul {
    width: 105%;
}

.portal li {
    position: relative;
    float: left;
    width: 271px;
    height: 130px;
    border: 1px solid #f5f5f5;
    border-radius: 6px;
    overflow: hidden;
    margin: 0 26px 26px 0;
    box-shadow: 0px 5px 10px 1px #ecf0f1;
}

.portal li h3 {
    width: 120px;
    height: 22px;
    margin-bottom: 15px;
    overflow: hidden;
    text-indent: 150px;
}

.portal li.l1 h3 {
    background-position: 0 0;
}

.portal li.l2 h3 {
    background-position: 0 -23px;
}

.portal li.l3 h3 {
    background-position: 0 -46px;
}

.portal li.l4 h3 {
    background-position: 0 -69px;
}

.portal li.l5 h3 {
    background-position: 0 -92px;
}

.portal li.l6 h3 {
    background-position: 0 -115px;
}

.portal li.l7 h3 {
    background-position: 0 -138px;
}

.portal li.l8 h3 {
    background-position: 0 -161px;
}

.portal li p {
    line-height: 20px;
    color: #999;
    font-size: 14px;
    width: 150px;
}

.portal li em {
    display: block;
    position: absolute;
    top: -31px;
    right: -21px;
    width: 117px;
    height: 117px;
}

.portal li.l1 em {
    background-position: 0 -200px;
}

.portal li.l2 em {
    background-position: -118px -200px;
}

.portal li.l3 em {
    background-position: 0 -318px;
}

.portal li.l4 em {
    background-position: -118px -318px;
}

.portal li.l5 em {
    background-position: 0 -436px;
}

.portal li.l6 em {
    background-position: -118px -436px;
}

.portal li.l7 em {
    background-position: 0 -554px;
}

.portal li.l8 em {
    background-position: -118px -554px;
}

.portalCon .arrow {
    position: absolute;
    bottom: 0;
    left: 50%;
    display: block;
    width: 176px;
    height: 35px;
    margin-left: -88px;
    background-position: 0 -940px;
}

.bottomLinkBox .arrow {
    position: absolute;
    top: 0;
    left: 50%;
    display: block;
    width: 176px;
    height: 35px;
    margin-left: -88px;
    background-position: 0 -881px;
}

.businessBox {
    width: 1221px;
    margin: 0 auto;
}

.businessCon .tabTit {
    position: absolute;
    right: 0;
    top: 38px;
    display: none;
}

.businessCon .tabTit a {
    display: block;
    height: 26px;
    float: left;
    padding: 0 15px;
    margin: 0 0 0 30px;
    border: 1px solid #eaeaea;
    font-size: 14px;
    color: #222;
    line-height: 26px;
}

.businessCon .tabTit a.cur {
    border: 2px solid #dd432f;
    color: #dd432f;
}

.businessCon .tabTit a:hover {
    color: #dd432f;
}

.businessBox .businessList {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.businessList .list .icon {
    visibility: hidden;
    position: absolute;
    top: -3px;
    right: 9px;
    z-index: 3;
    font-size: 32px;
    color: #bc9f6b;
    font-family: "iconfont";
    display: inline-block;
}

.list.company .icon::before {
    content: '\e670';
}

.list.purchase .icon::before {
    content: '\e673';
}

.list.tradeArea .icon::before {
    content: '\e673';
}

.proCon p {
    position: absolute;
    bottom: 10px;
    right: 6px;
    height: 16px;
    color: #d1d1d1;
    padding: 0 5px;
    border: 1px solid #f5f5f5;
    line-height: 16px;
}

.list.news .img {
    width: 220px;
    height: 167px;
    overflow: hidden;
}

.list.news img {
    width: 220px;
    height: 167px;
}

.list.news .newsCon {
    padding: 15px 14px;
    height: 108px;
}

.list.news .info {
    height: 50px;
    border-top: 1px solid #eaedf3;
    padding: 0 14px;
    color: #999;
    font-size: 14px;
    line-height: 50px;
}

.list.news .tit {
    line-height: 22px;
    height: 66px;
    overflow: hidden;
    font-size: 16px;
    margin-bottom: 15px;
}

.list.news .tit a {
    color: #222;
}

.list.news .newsCon p {
    font-size: 16px;
    color: #999;
}

.list.extension .img {
    width: 228px;
    height: 334px;
    border-radius: 6px;
    overflow: hidden;
}

.list.extension img {
    width: 228px;
    height: 355px;
}

.proCon .tit a {
    color: #222;
}

.list.news .tit a:hover,
.proCon .tit a:hover,
.proCon .companyName a:hover,
.list.company .name a:hover,
.purchase .tit a:hover,
.search_record a:hover {
    color: #dd432f;
}

.purchase .tit {
    padding: 29px 33px 14px 18px;
    border-bottom: 1px solid #eaedf3;
    font-size: 18px;
}

.purchase .tit p {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    letter-spacing: 0px;
    color: #222222;
}

.purchase .tit a {
    color: #222;
}

.purchaseCon {
    padding: 9px 0 19px 0;
}

.purchaseCon .top {
    height: 64px;
    border-radius: 10px;
    overflow: hidden;
    text-align: center;
    margin-left: 14px;
}

.purchaseCon .top p {
    font-size: 14px;
    color: #3c3d41;
    line-height: 1;
    margin-bottom: 15px;
}

.purchaseCon dd {
    float: left;
    width: 21px;
    height: 25px;
    text-align: center;
    line-height: 26px;
}

.purchaseCon dd.red {
    color: #fff;
    font-family: Arial;
    background-position: -95px -790px;
    font-size: 12px;
}

.purchaseCon .time {
    width: 168px;
    margin: 0 auto;
}

.purchaseCon ul {
    padding: 18px 0 15px 21px;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    letter-spacing: 0px;
    color: #3c3d41;
}

.purchaseCon ul li {
    line-height: 18px;
    color: #3c3d41;
    font-size: 12px;
    line-height: 1.6;
}

.purchaseCon .quotedPrice {
    display: block;
    width: 120px;
    height: 25px;
    border-radius: 50px;
    text-align: center;
    line-height: 25px;
    margin: 0 auto;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    letter-spacing: 0px;
    color: #ee2626;
    background-color: rgba(238, 38, 38, 0.1);
    border: solid 1px rgba(238, 38, 38, 0.3);
}

.list.serviceShow .tradeAreaCon .btn,
.list.serviceShow.exhibition .btn,
.list.serviceShow .purchaseCon .quotedPrice {
    background: #ee2626;
    color: #fff;
}

.purchase .more {
    text-align: center;
    margin-bottom: 25px;
}

.purchase .more a {
    display: block;
    line-height: 1;
    color: #999;
    font-size: 12px;
    background: none;
}

.purchase .more a:first-child {
    width: 70px;
    padding: 0 5px;
    color: #d78c1c;
    line-height: 18px;
    border: 1px solid #d78c1c;
    border-radius: 50px;
    font-size: 12px;
    margin: auto;
}

.webLink {
    text-align: left;
    font-size: 14px;
    line-height: 30px;
    padding: 2px 0 20px;
    width: 1100px;
    border-bottom: 1px solid #e0e0e4;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    z-index: 99;
}

.webLink,
.webLink a {
    color: #222;
}

.webLink em {
    padding: 0 15px 0 18px;
}

.bottomLinkBox {
    margin-top: 10px;
    padding-top: 20px;
    background: #f1f1f5;
    position: relative;
    padding-bottom: 54px;
}

.hcService {
    width: 1100px;
    margin: 0 auto;
    padding: 30px 0 41px;
    overflow: hidden;
}

.serviceLeft {
    float: left;
    width: 700px
}

.serviceLeft li {
    width: 98px;
    float: left;
    padding-left: 50px
}

.serviceLeft li h3,
.serviceRig li h3 {
    line-height: 34px;
    font-size: 14px;
    color: #222;
}

.serviceLeft li a {
    color: #a7a7a7;
    font-size: 12px;
    line-height: 24px
}

.serviceLeft li a:hover,
.purchase .more a:hover {
    color: #dd432f
}

.serviceRig {
    width: 1045px;
    position: absolute;
    bottom: 6%;
    text-align: right;
    z-index: 1;
}

.serviceRig ul {
    display: inline-block;
}

.serviceRig li:first-child {
    display: none;
}

.serviceRig li {
    float: left;
    width: 82px;
    margin-left: 24px;
}

.serviceRig li h3 {
    text-align: center
}

.serviceRig li .codeImg {
    width: 82px;
    height: 82px;
    margin: 0 auto;
    padding-top: 5px;
}

.serviceRig li .codeImg img {
    width: 82px;
    height: 82px;
}

.weblinkTxt {
    width: 1090px;
    margin: 0 auto;
    border-top: 1px solid #212121;
    padding: 0 10px
}

.linkWrap {
    width: 860px;
    display: flex;
    align-items: flex-start;
    flex-direction: row;
    position: absolute;
    z-index: 99;
}

.linkWrap h3 {
    line-height: 26px;
    font-size: 14px;
    color: #999;
    margin-right: 15px;
}

.linkWrap p {
    font-size: 12px;
    color: #999;
    line-height: 24px;
    flex: 1;
}

.linkWrap p span {
    padding: 0 5px
}

.linkWrap a {
    color: #999;
    position: relative;
    padding-left: 20px;
}

.linkWrap a:before {
    content: "";
    position: absolute;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    left: 7px;
    top: 50%;
    transform: translateY(-50%);
    background-color: #999;
}

.footerBox {
    background: #f1f1f5;
    overflow: hidden;
    padding-bottom: 25px;
}

.webLogo {
    padding: 10px 0 18px 10px;
    text-align: center
}

.webLogo a {
    display: inline-block;
    height: 36px;
    margin: 0 5px;
    background: url("//style.org.hc360.com/images/Nindex/news2017/f_pic.png") no-repeat;
}

.webLogo a.hover1 {
    background-position: 0 -128px;
    width: 83px
}

.webLogo a.hover2 {
    background-position: -85px -128px;
    width: 83px
}

.webLogo a.hover3 {
    background-position: -170px -128px;
    width: 93px
}

.webLogo a.hover4 {
    background-position: -265px -128px;
    width: 98px
}

.webLogo a.hover5 {
    background-position: -365px -128px;
    width: 85px
}

.webLogo a.hover6 {
    background-position: -452px -128px;
    width: 81px
}

.webLogo a.hover7 {
    background-position: -535px -128px;
    width: 99px
}

.webLogo a.hover8 {
    background-position: -636px -128px;
    width: 96px
}

.webLogo a.hover9 {
    background-position: -735px -128px;
    width: 169px
}

.copyTxt {
    color: #222;
    line-height: 26px;
    text-align: center;
    padding: 26px 0 20px;
    font-size: 14px;
}

.copyTxt a {
    color: #222;
    margin-right: 15px;
}

.indexes {
    padding-top: 20px;
    text-align: center;
    clear: both;
    line-height: 26px;
    padding: 15px 0 0;
}

.indexes,
.indexes a {
    color: #636363;
    font-size: 14px;
}

.indexes a {
    padding: 0 9px 0 8px;
    display: inline-block;
}

.copy {
    text-align: center;
    font-size: 14px;
    color: #636363;
    line-height: 26px;
}

.copy span {
    padding-right: 10px
}

.copy span a {
    color: #636363
}

.copy span.reportMail {
    padding-right: 30px
}

.list em.ad {
    position: absolute;
    z-index: 60;
    line-height: 16px;
    text-align: center;
    filter: alpha(opacity=40);
    -moz-opacity: .4;
    -khtml-opacity: .4;
    opacity: .4;
    bottom: 12px;
    right: 12px;
    height: 16px;
    color: #d1d1d1;
    padding: 0 5px;
    border: 1px solid #eaeaea;
}

.rigSidebar {
    position: fixed;
    left: 50%;
    margin-left: 680px;
}

.scrollTop::before {
    content: '\e66b';
    font-size: 38px;
    color: #fff;
    font-family: iconfont;
    display: block;
    text-align: center;
    line-height: 60px;
    width: 60px;
    height: 60px;
    background-color: #ee2626;
    box-shadow: 3.7px 3.4px 8px 0px rgba(238, 38, 38, 0.24);
    border-radius: 6px;
}

.w1170 {
    width: 1200px;
    margin: 0 auto;
}

.releaseCon {
    overflow: hidden;
    height: 102px;
    padding-top: 106px;
}

.releaseCon .fr {
    padding-right: 20px;
}

.releaseCon a {
    display: block;
    float: left;
    width: 40px;
    height: 40px;
    font-size: 16px;
    color: #fff;
    text-align: center;
    line-height: 20px;
    padding: 21px;
    margin-left: 18px;
}

.releaseCon a.addProduct {
    background-position: 0 -998px;
}

.releaseCon a.addProcure {
    background-position: -100px -998px;
}

.headerCon {
    width: 1190px;
    margin: 0 auto
}

.logo {
    width: 440px;
    height: 95px;
    margin: 0 auto;
    padding: 77px 0 54px;
}

.logo a {
    display: block;
    height: 95px;
    width: 440px;
    background-image: url(//style.org.hc360.com/images/logo/homeLogo.svg), none;
    background-repeat: no-repeat;
    background-size: 260px;
    background-position: center;
}

.h_search {
    width: 664px;
    overflow: visible;
    height: 54px;
    margin: 0 auto;
}

.h_search ul li span,
.totalnum span {
    color: #999;
    float: right;
}

.logo_search {
    width: 660px;
    height: 54px;
    clear: both;
    overflow: visible;
    position: relative;
    z-index: 1211;
    background: #fff;
    border-radius: 27px;
    box-shadow: 0px 2px 8px 0px rgba(34, 34, 34, 0.2);
    transition: .4s;
}

.logo_search_l {
    float: left;
    width: 624px;
    height: 54px;
    _height: 34px;
    border-right: none;
    position: relative;
    z-index: 400;
}

.logo_search_l .searchdetail {
    position: absolute;
    left: 118px;
    top: 16px;
    color: #999;
    font-size: 14px;
    cursor: default !important;
    line-height: 18px;
}

.logo_search_l .txt_key {
    height: 54px;
    line-height: 54px;
    width: 480px;
    color: #333;
    border: none;
    background: none;
    font-size: 16px;
    float: left;
    margin-left: 98px;
    padding-left: 20px;
    margin-top: 0;
}

.SearchWrap {
    _margin-right: 6px;
    height: 54px;
    position: relative;
    z-index: 1211;
    overflow: visible;
    width: 660px;
}

.SearchWrap button {
    position: absolute;
    right: 0;
    top: 0;
    border: none;
    text-align: center;
    font-size: 14px;
    margin-right: 16px;
}

.SearchWrap .SearBtn {
    height: 54px;
    background-color: transparent;
}

#vue-header-app .SearchWrap .SearBtn:before {
    content: "\e674";
    color: #fff;
    font-family: "iconfont";
    display: inline-block;
    font-size: 16px;
}

.SearchWrap .SearBtn:before {
    content: "\e674";
    color: #ee2626;
    font-family: "iconfont";
    display: inline-block;
    font-size: 26px;
}

.SearchWrap .commdBtn {
    background: #f9f9f9;
    width: 98px;
    height: 38px;
    border: 1px solid #dcdcdc;
    color: #666;
    line-height: 36px
}

.SearchWrap_cont {
    display: none;
    position: absolute;
    left: 98px;
    top: 52px;
    width: 510px;
    background: #fff;
    z-index: 400;
    border-top: none;
    border: 1px solid #f5f5f5;
    box-shadow: 0px 5px 10px 1px #ecf0f1;
    border-radius: 6px;
    overflow: hidden;
}

.SearchWrap_cont ul {
    height: auto;
    overflow: hidden;
    padding: 15px 0 5px;
}

.SearchWrap_cont ul li,
.totalnum {
    line-height: 30px;
    height: 30px;
    padding: 0 10px;
    color: #999;
    cursor: pointer;
    font-size: 14px;
}

.SearchWrap_cont ul li.listCur {
    background: #f7f7f7
}

.SearchWrap_cont ul li a:link,
.SearchWrap_cont ul li a:visited,
.totalnum a:link,
.totalnum a:visited {
    color: #999
}

.SearchWrap_cont ul li a:hover {
    color: #dd432f
}

.SearchWrap_cont ul li a {
    height: 28px;
}

.SearchWrap_cont .lilast {
    border-top: 1px solid #eee;
    text-align: center;
    color: #282828;
    cursor: auto;
    height: 40px;
    line-height: 40px;
    margin: 0 20px;
}

ul li.bwlist {
    cursor: auto;
    height: auto;
    text-indent: 0;
    width: auto;
    color: #333;
}

ul.cgListContent li:hover {
    background: #f7f7f7;
}

ul li .b_title {
    padding-left: 10px;
    background: #f7f7f7
}

ul li.bwlist dl {
    padding: 10px 0 0;
    overflow: hidden;
    width: 105%;
}

ul li.bwlist dl dd {
    margin: 0 14px 10px 14px;
    display: inline-block;
}

li.bwlist dl dd .picbox {
    width: 90px;
    height: 90px;
    overflow: hidden;
    border: 1px solid #ececee;
}

li.bwlist dl dd .picbox a {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    overflow: hidden;
    width: 90px;
    height: 90px;
}

.SearchWrap_cont li.bwlist dl dd a {
    color: #282828;
}

li.bwlist dl dd .pay {
    color: #dd432f;
    line-height: 14px;
    font-size: 14px;
}

li.bwlist dl dd .txtil {
    width: 90px;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    height: 12px;
    line-height: 12px;
    margin: 10px 0;
    font-size: 12px;
}

li.bwlist dl dd a:hover {
    color: #dd432f;
}

li.bwlist dl dd .picbox img {
    max-height: 90px;
    max-width: 90px;
}

.searchSele {
    height: 54px;
    width: 98px;
    float: left;
    left: 2px;
    top: 0px;
    z-index: 500;
    position: absolute;
}

.searchSele p {
    height: 54px;
    line-height: 50px;
    color: #222;
    text-align: center;
    font-size: 16px;
    padding: 0 5px;
}

.searchSele em {
    display: block;
    height: 18px;
    width: 22px;
    position: absolute;
    top: 18px;
    right: 0;
    background-position: -271px 5px;
    border-right: 1px solid #e8e8e8;
}

.searchSele.seleShow em {
    background-position: -271px -38px;
}

.searchSele.seleShow ul {
    display: block
}

.searchSele ul {
    position: absolute;
    top: 52px;
    left: -2px;
    width: 98px;
    background: #fff;
    line-height: 30px;
    border-top: 0;
    display: none;
    border: 1px solid #f5f5f5;
    box-shadow: 0px 5px 10px 1px #ecf0f1;
    border-radius: 6px;
    overflow: hidden;
}

.searchSele li {
    height: 44px;
    color: #282828;
    cursor: pointer;
    font-size: 14px;
    text-align: center;
    line-height: 44px;
}

.searchSele li.seleCur,
.searchSele li:hover {
    color: #fff;
    margin: 0;
    background: #ed0011;
}

.h_search .SearchWrap_record {
    position: absolute;
    left: 98px;
    top: 52px;
    width: 480px;
    padding: 10px 15px 25px;
    background: #fff;
    z-index: 400;
    border: 1px solid #f5f5f5;
    box-shadow: 0px 5px 10px 1px #ecf0f1;
    display: none;
    border-radius: 6px;
}

.SearchWrap_record .history_title {
    color: #222;
    font-size: 14px;
    height: 18px;
    line-height: 18px;
    margin: 13px 5px 17px;
}

.history_word {
    clear: both;
    overflow: hidden;
    padding-bottom: 8px;
    border-bottom: 1px solid #eee;
    margin: 0 5px 5px;
}

.history_word li {
    float: left;
    text-align: center;
    line-height: 30px;
    margin: 0 10px 10px 0;
    display: block;
    border-radius: 30px;
}

.history_word li a {
    color: #222;
    padding: 0 20px;
    text-indent: 0;
    display: block;
    text-align: left;
    background: #f7f7f7;
    border-radius: 30px;
}

.SearchWrap_record .hotSearch_tt,
.SearchWrap_cont .hotSearch_tt {
    color: #222;
    font-size: 14px;
    height: 24px;
    line-height: 24px;
}

.SearchWrap_record .hotSearch_tt:before {
    content: "\e676";
    color: #ed0212;
    font-family: "iconfont";
    display: inline-block;
    font-size: 18px;
    margin-right: 5px;
}

.SearchWrap_cont .hotSearch_tt:before {
    content: "\e676";
    color: #ed0212;
    font-family: "iconfont";
    display: inline-block;
    font-size: 18px;
}

.hotSearch_word {
    clear: both;
    padding: 10px 0 0 0;
    overflow: hidden;
    white-space: nowrap;
    line-height: 22px;
}

.hotSearch_word li,
.SearchWrap_cont .hotSearch_word li {
    float: left;
    margin-right: 20px;
    line-height: 22px;
    text-indent: 0;
    padding: 0;
    height: 22px;
    font-size: 12px;
}

.hotSearch_word li a {
    color: #999;
}

.hotSearch_word li a:hover {
    text-decoration: none;
    color: #dd432f;
}

.hotSearch {
    width: 102%;
    overflow: hidden;
    line-height: 26px;
}

.seleCon {
    cursor: pointer;
}

.search_record {
    padding: 27px 0 0 37px;
    line-height: 1;
    font-size: 14px;
    color: #999;
}

.search_record a {
    color: #999;
    margin-right: 2px;
}

.hcLogo {
    float: left;
    padding: 3px 25px 7px 5px;
    width: 141px;
    display: none;
    height: 48px;
}

.hcLogo a {
    display: block;
    height: 48px;
    width: 140px;
    background-image: url(//style.org.hc360.com/images/Nindex/news2019/logo140x48.png);
    background-image: url(//style.org.hc360.com/images/logo/logo191x65.svg), none;
    background-repeat: no-repeat;
    background-size: 140px 48px
}

.searchCon.bounce-out {
    background-color: hsla(0, 0%, 100%, .95);
    box-shadow: 0 0 6px rgba(0, 0, 0, .3);
    position: fixed;
    top: 0;
    left: 70px;
    transition: .8s;
    z-index: 1212;
    height: 54px;
    padding: 18px 0 18px;
    right: 0;
}

.searchCon.bounce-out .searchCon {
    width: 1170px;
    margin: 0 auto;
}

.searchCon.bounce-out .h_search {
    float: left;
}

.searchCon.bounce-out .search_record {
    display: none;
}

.searchBox {
    padding: 15px 0 150px;
    height: 54px;
}

.searchCon.bounce-out .fr {
    padding: 7px 0;
    display: block;
}

.searchCon.bounce-out .fr a.addProduct,
.searchCon.bounce-out .fr a.addProcure {
    display: block;
    float: left;
    width: 100px;
    height: 40px;
    line-height: 40px;
    font-size: 16px;
    color: #222;
    text-align: left;
    margin: 0 0 0 18px;
    background-position: 0 -1160px;
    padding-left: 20px;
}

.searchCon .fr {
    display: none;
}

.searchCon.bounce-out .hcLogo {
    display: block;
}

.topAdImg {
    height: 80px;
    margin-left: 70px;
    position: relative;
}

.topAdImg a {
    display: block;
    height: 80px;
    width: 100%;
}

.topAdImg a:after {
    content: url(//style.org.hc360.com/images/homepage/2020/adImg.png);
    position: absolute;
    z-index: 60;
    width: 36px;
    height: 18px;
    line-height: 16px;
    text-align: center;
    filter: alpha(opacity=60);
    -moz-opacity: .4;
    -khtml-opacity: .4;
    opacity: .4;
    bottom: 5px;
    right: 5px;
    color: #d1d1d1;
}

.toolbarBox {
    height: 60px;
    background: #fff;
}

.toolbarCon {
    width: 1200px;
    margin: 0 auto;
    height: 55px;
    padding-top: 5px;
}

.toolbarLeft {
    float: left;
    line-height: 60px;
    font-size: 14px;
}

.toolbarLeft a.login {
    float: left;
    margin-right: 30px;
    line-height: 60px;
    color: #2e2e2e;
}

.login-status {
    display: none
}

.topReg {
    float: left;
    line-height: 60px;
    height: 60px;
    position: relative;
    margin-right: 30px;
}

.topReg a.reg {
    color: #ed0011;
    display: block;
    height: 60px;
}

.toolbarBox .regAlert {
    height: 22px;
    position: absolute;
    left: 30px;
    top: 60px;
    padding: 0 28px 0 18px;
    background: #d94536;
    white-space: nowrap;
    border-radius: 30px;
    font-size: 12px;
}

.toolbarBox .regAlert a {
    display: block;
    line-height: 22px;
    color: #fff;
    text-align: center
}

.toolbarBox .userName {
    float: left;
    color: #2e2e2e;
    padding-left: 32px;
    background: url(//style.org.hc360.com/images/homepage/2020/icon.png) no-repeat -258px -70px;
}

.toolbarBox .exit {
    float: left;
    margin-left: 18px;
    color: #999;
}

.toolbarBox .newsBtn {
    margin-left: 50px;
    color: #2e2e2e;
    padding-left: 32px;
    position: relative;
    display: block;
    height: 60px;
    float: left;
    background: url(//style.org.hc360.com/images/homepage/2020/icon.png) no-repeat -258px -115px;
}

.toolbarBox .newsBtn span {
    display: block;
    position: absolute;
    top: 11px;
    right: auto;
    left: 22px;
    color: #fff;
    background: #ed0011;
    line-height: 12px;
    text-indent: 3em;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    overflow: hidden;
}

.toolbarRig {
    float: right
}

.toolbarRig li {
    float: left;
    position: relative;
    z-index: 1212
}

.navTitle,
.purchaselist {
    padding: 0 0 0 25px;
    line-height: 55px;
    position: relative;
    height: 55px;
    font-size: 14px;
}

.navTitle a {
    display: block;
    height: 55px;
    padding-right: 18px;
    background: url(//style.org.hc360.com/images/homepage/2020/icon.png) no-repeat -204px -771px;
    font-size: 14px;
}

.toolbarRig .navCon {
    position: absolute;
    top: 55px;
    padding: 18px 14px;
    background: #fff;
    box-shadow: 0 0 10px #e3e3e3;
    display: none;
    border-radius: 6px;
}

.toolbarRig .navCon.w225 {
    width: 243px;
    left: 26px;
}

.toolbarRig .navCon.w180 {
    width: 190px;
}

.toolbarRig .navCon dd h3 {
    font-size: 14px;
    color: #282828;
    line-height: 30px
}

.toolbarRig .navCon dd a {
    display: block;
    float: left;
    font-size: 12px;
    color: #999;
    line-height: 24px;
    margin-right: 13px;
}

.toolbarRig .navCon dd {
    overflow: hidden;
    line-height: 24px;
}

.toolbarRig .navCon em {
    display: block;
    position: absolute;
    top: -7px;
    left: 16px;
    background: url(//style.org.hc360.com/images/Nindex/news2019/icon.png) 5px -222px;
    width: 23px;
    height: 11px;
}

.purchaselist a {
    line-height: 60px;
    color: #d94536;
    position: relative;
    display: block;
    height: 40px;
    float: left;
    width: 60px;
    background: url(//style.org.hc360.com/images/homepage/2020/icon.png) no-repeat -258px -172px;
}

.purchaselist a span {
    display: inline-block;
    position: absolute;
    top: -2px;
    left: 25px;
    color: #fff;
    height: 15px;
    padding: 0 5px;
    border-radius: 10px;
    background: #d94536;
    line-height: 14px;
    font-size: 12px;
}

.toolbarRig .navCon.kf {
    width: 94px;
    padding: 20px 0;
    text-align: center;
    left: 3px
}

.toolbarRig .navCon.kf em {
    left: 40px
}

.toolbarRig .navCon.kf dd {
    border: 0;
    text-align: center;
    padding: 0;
    margin: 0
}

.toolbarRig .navCon.kf dd a {
    display: block;
    float: none;
    margin: 0;
    line-height: 30px;
    font-size: 14px;
    color: #282828
}

.toolbarRig .navCon dd a:hover,
.toolbarLeft a:hover {
    color: #ed0011;
}

.navCon.siteMap {
    width: 398px;
    right: -99px;
    left: auto;
}

.navCon.siteMap em {
    right: 132px;
    left: auto;
}

/* .navCon.siteMap h3 {
    float: left;
    width: 88px;
    display: block;
    line-height: 24px;
} */

.navCon.siteMap .sitemapLink {
    padding-bottom: 10px;
    border-bottom: 1px solid #e9eaec;
}

.navCon.iphone {
    width: 223px;
    left: auto;
    right: 0;
    padding: 20px 10px 15px;
    height: 121px;
}

.navCon.iphone dd {
    float: left;
    padding: 0;
    margin: 0;
}

.navCon.iphone dd .navCodeImg {
    border: 1px solid #e9eaec
}

.navCon.iphone dd p {
    color: #222;
    text-align: center;
    padding: 10px 0;
    font-size: 12px;
}

.navCon.iphone em {
    left: auto;
    right: 34px;
}

.unitBox ul {
    position: absolute;
    top: 38px;
    left: -1px;
    background: #f3f3f4;
    line-height: 24px;
    color: #959595;
    display: none;
    width: 72px
}

.unitBox ul li {
    height: 28px;
    padding: 0 8px;
    width: 56px;
    cursor: pointer
}

.unitBox ul li:hover {
    background: #e9eaec
}

.navCon.iphone dd,
.navCon.siteMap dd,
.navCon.siteMap dd:last-child .sitemapLink,
.navCon.w180 dd:last-child,
.navCon.w225 dd:last-child {
    border-bottom: 0
}

.toolbarBox .regAlert em {
    background: url(//style.org.hc360.com/images/Nindex/news2019/icon.png) -8px 0;
    display: block;
    position: absolute;
    left: 8px;
    top: -4px;
    width: 14px;
    height: 4px
}

.purchaselist {
    display: block;
    width: 40px;
    height: 40px;
    margin-top: 10px;
}

.searchSele li:hover {
    color: #dd432f;
    background: #fff;
}

.searchSele li.seleCur:hover {
    color: #fff;
    background: #dd432f;
}

.SearchWrap_cont ul.cgListContent {
    padding: 10px 0;
    border-bottom: 1px solid #eee;
    margin: 0 15px;
}

.history_word li a:hover,
.linkWrap a:hover,
.webLink a:hover,
.copyTxt a:hover,
.indexes a:hover,
.copy span a:hover {
    color: #dd432f;
}

.SearchWrap_cont .hotSearch_word ul {
    padding: 0 0 20px 24px;
}

.SearchWrap_cont .hotSearch_tt {
    margin: 5px 24px 0;
}

.portal li a {
    display: block;
    padding: 32px 0 0 40px;
    height: 98px;
}

.SearchWrap_cont ul.bwListContent {
    padding: 20px 0 10px;
    width: 480px;
    border-bottom: 1px solid #eee;
    margin: 0 15px;
}

.SearchWrap_cont ul.bwListContent li {
    float: left;
    padding: 0;
}

li.bwlist dl dd .picbox a img,
.list.extension .img a img,
.list.news .img a img,
.list.company .img a img,
.list.product .img img,
.list.exhibition .img a img {
    -webkit-transition: all .5s ease 0s;
    -moz-transition: all .5s ease 0s;
    -o-transition: all .5s ease 0s;
    transition: all .5s ease 0s
}

li.bwlist dl dd .picbox a:hover img,
.list.extension .img a:hover img,
.list.news .img a:hover img,
.list.company .img a:hover img,
.list.product a:hover img,
.list.exhibition .img a:hover img {
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -o-transform: scale(1.05);
    transform: scale(1.05)
}

.navCon.iphone .fl {
    padding: 2px 7px 0;
    width: 107px;
}

.navCon.iphone .fl p {
    margin: 0 0 8px;
    height: 14px;
    padding: 2px 0 0 10px;
    text-align: left;
    border-left: 3px solid #fff;
    line-height: 14px;
    cursor: pointer;
    transition: .3s;
}

.navCon.iphone .fl p:nth-child(2),
.navCon.iphone .fl p:nth-child(3) {
    display: none;
}

.navCon.iphone .fr .codeImg {
    width: 95px;
    height: 95px;
    display: none;
    border: 1px solid #f1f1f3;
}

.navCon.iphone .fl p.cur {
    color: #ed0011;
    border-left: 3px solid #ed0011;
    font-size: 14px;
}

.navCon.iphone .fr .codeImg img {
    width: 95px;
}

.navCon.iphone .fl p:hover {
    color: #ed0011;
    font-size: 14px;
}

.SearchWrap_record .hotSearch_tt,
.SearchWrap_record .hotSearch_word {
    margin: 0 5px;
}

.portal li,
.releaseCon a {
    transition: All 0.3s ease-in-out;
    -webkit-transition: All 0.3s ease-in-out;
    -moz-transition: All 0.3s ease-in-out;
    -o-transition: All 0.3s ease-in-out;
}

.portal li:hover,
.releaseCon a:hover {
    transform: translate(0, -4px);
    -webkit-transform: translate(0, -4px);
    -moz-transform: translate(0, -4px);
    -o-transform: translate(0, -4px);
    -ms-transform: translate(0, -4px);
}

.searchCon.bounce-out .fr a {
    border-radius: 6px;
}

.searchCon.bounce-out .fr a:hover {
    box-shadow: 0 0 5px 0 #ecf0f1;
    transition: .3s;
}

.logo_search:hover {
    box-shadow: 0px 2px 8px 0px rgba(34, 34, 34, 0.4);
    transition: .4s;
}

.logo_search input::-webkit-input-placeholder {
    color: #4c4948;
    opacity: 0.6;
    font-size: 14px;
}

.logo_search::-webkit-input-placeholder {
    color: #4c4948;
    font-size: 14px;
    opacity: 0.6;
}

.logo_search:-moz-placeholder {
    color: #4c4948;
    font-size: 14px;
    opacity: 0.6;
}

.navCon.iphone dd .fr {
    margin-top: 12px;
}

.businessCon .title a {
    position: absolute;
    right: 0;
    top: 45px;
    font-size: 18px;
    color: #999;
    display: block;
    float: right;
    padding-left: 30px;
    background: url(//style.org.hc360.com/images/homepage/2020/icon.png) no-repeat -258px -238px;
    line-height: 24px;
}

.changeBtn a:hover,
.businessCon .title a:hover {
    color: #ed0011;
}

.changeBtn {
    text-align: center;
    height: 24px;
    padding-top: 24px;
    clear: both;
}

.changeBtn a {
    font-size: 18px;
    color: #999;
    padding-left: 30px;
    background: url(//style.org.hc360.com/images/homepage/2020/icon.png) no-repeat -258px -239px;
    line-height: 24px;
    display: block;
    margin: 0 auto;
    width: 54px;
    clear: both;
}

.search_record span {
    color: #999
}

.tradeAreaCon .con {
    padding: 34px 17px 0;
    height: 50px;
}

.tradeAreaCon .con .img {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid rgba(234, 237, 243, 0.6);
}

.tradeAreaCon .con .img a {
    display: table-cell;
    width: 48px;
    height: 48px;
    vertical-align: middle;
}

.tradeAreaCon .con .img img {
    max-width: 48px;
    max-height: 48px;
}

.tradeAreaCon .con .fr {
    width: 128px;
}

.tradeAreaCon .con .tit {
    font-size: 14px;
    color: #222;
    height: 40px;
    line-height: 20px;
    margin: 7px 0;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    text-overflow: ellipsis;
    overflow: hidden;
    word-break: break-all;
}

.tradeAreaCon .con .num {
    font-size: 12px;
    color: #999;
    line-height: 16px;
    position: absolute;
    bottom: 65px;
    left: 0;
    right: 0;
    text-align: center;
}

.tradeAreaCon .intro {
    width: 85%;
    padding: 18px 17px 0;
    line-height: 20px;
    color: #999;
    font-size: 14px;
    height: 60px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    text-overflow: ellipsis;
    word-break: break-all;
}

.tradeAreaCon a.btn {
    display: block;
    width: 120px;
    height: 25px;
    border-radius: 50px;
    text-align: center;
    line-height: 25px;
    margin: 0 auto;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    letter-spacing: 0px;
    color: #ee2626;
    background-color: rgba(238, 38, 38, 0.1);
    border: solid 1px rgba(238, 38, 38, 0.3);
}

.tradeAreaCon .bot {
    width: 181px;
    margin: 0 auto;
    padding: 26px 0 55px;
    height: 45px
}

.tradeAreaCon .bot em {
    display: block;
    margin: 0 auto;
    width: 24px;
    height: 24px;
    background: url(//style.org.hc360.com/images/chat/homeIcon.png) 0 0;
}

.tradeAreaCon .bot p {
    color: #222;
    font-size: 12px;
    line-height: 30px;
}

.tradeAreaCon .bot .line {
    float: left;
    width: 1px;
    height: 38px;
    background: #ececec;
    margin-top: 6px;
}

.tradeAreaCon .bot .shop,
.tradeAreaCon .bot .pro {
    float: left;
    width: 90px;
    text-align: center;
}

.tradeAreaCon .shop em {
    background-position: 0 -200px;
}

.tradeAreaCon .pro em {
    background-position: -25px -200px;
}

.tradeAreaCon .bot a {
    display: block;
}

.tradeAreaCon .bot a:hover p {
    color: #ed0011;
}

.purchaseCon a:hover {
    color: #fff;
}

.commodityCon .businessList .list {
    margin: 11px;
}

.list.hover .contactBtn {
    top: 0;
    display: block;
}

.qyhIcon,
.hsyIcon,
.vipIcon,
.ypIcon,
.jpIcon,
.bjIcon,
.vip2Icon {
    background: url(//style.org.hc360.com/search/images/searchIcon2020.png) 0 0 no-repeat;
    display: block;
    margin-left: 5px;
    line-height: 20px;
}

.vipTit em.qyhIcon {
    width: 20px;
    background-position: 4px -26px;
}

.vipTit em.hsyIcon {
    width: 23px;
    background-position: 0 6px;
}

.vipTit em.vipIcon {
    width: 18px;
    background-position: 0 -118px;
}

.vipTit em.ypIcon {
    width: 18px;
    background-position: 0 -87px;
}

.vipTit em.jpIcon {
    width: 18px;
    background-position: 0 -56px;
}

.vipTit em.bjIcon {
    width: 18px;
    background-position: 0 -149px;
}

.vipTit em.vip2Icon {
    width: 18px;
    background-position: 0 -180px;
}

.arrondiIntro {
    overflow: hidden;
    padding: 30px 28px;
    border-bottom: 1px solid #eaedf3;
    background: #fff;
}

.arrondiIntro .fl {
    width: 74px;
    height: 74px;
    border-radius: 8px;
    overflow: hidden;
}

.arrondiIntro .img {
    width: 72px;
    height: 72px;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    border: 1px solid rgba(234, 237, 243, 0.6);
    overflow: hidden;
    border-radius: 10px;
}

.arrondiIntro .img img {
    max-width: 72px;
    max-height: 72px;
}

.arrondiIntro .intro {
    padding-left: 94px;
}

.arrondiIntro .intro .tit {
    padding-bottom: 8px;
    line-height: 20px;
    font-size: 18px;
    color: #222;
    padding-top: 2px;
}

.arrondiIntro .tit a {
    color: #ee2626;
    float: right;
    display: block;
    width: 98px;
    height: 28px;
    border-radius: 6px;
    font-size: 14px;
    border: 1px solid #ee2626;
    line-height: 28px;
    text-align: center;
    margin-top: -11px;
    transition: .3s;
}

.arrondiIntro .tit a:hover {
    color: #fff;
    background: #ee2626;
}

.arrondiIntro .intro span {
    font-weight: bold;
    padding-left: 5px;
    word-break: keep-all;
}

.arrondiIntro .intro p {
    line-height: 22px;
    color: #999;
    font-size: 14px;
    word-break: break-all;
}

.arrondiCon {
    padding: 30px 12px;
    min-width: 980px;
    overflow: auto;
}

.arrondiCon .businessList .list {
    margin: 12px;
}

.arrondiCon h2 {
    font-size: 20px;
    padding-left: 12px;
    border-left: 4px solid #ed0011;
    color: #222;
    line-height: 20px;
    height: 20px;
    margin: 0 0 10px 12px;
}

.newsCon:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden
}

.newsCon {
    clear: both;
    padding-top: 18px;
    /* *+height: 1%; */
}

.arrondiCon .list.hover .contactBtn {
    top: 0;
    display: block;
}

.newsList {
    overflow: hidden;
    box-shadow: 0 1px 10px 0 rgba(144, 144, 144, 0.2);
    padding: 0 28px;
    background: #fff;
    margin: 22px 12px 0;
    width: 896px;
    border-radius: 6px;
}

.newsList li {
    padding: 15px 3px;
    height: 30px;
    line-height: 30px;
    border-bottom: 1px solid #f2f4f8;
}

.newsList li:last-child {
    border-bottom: 0;
}

.newsList li * {
    float: left;
    font-size: 14px;
}

.newsList li em {
    display: block;
    width: 6px;
    height: 6px;
    background: #f46670;
    border-radius: 50%;
    margin-top: 12px;
}

.newsList li p {
    margin-left: 11px;
    font-size: 14px;
}

.newsList li p.time {
    color: #999;
}

.newsList li p.name {
    color: #222;
}

.newsList li a {
    color: #ee2626;
    margin-left: 20px;
}

.non-existent .img {
    width: 500px;
    height: 244px;
    margin: 0 auto;
    background: url(//style.org.hc360.com/images/chat/404Img.png);
    background-size: 500px 244px;
}

.non-existent,
.non-chat {
    text-align: center;
    color: #222;
    line-height: 40px;
    overflow: hidden;
    padding: 80px 0 50px;
    width: 573px;
    margin: 0 auto;
}

.non-existent h3,
.non-chat h3 {
    font-size: 18px;
    padding: 25px 0 0;
}

.non-existent p,
.non-chat p {
    margin-bottom: 20px;
    font-size: 14px;
    line-height: 20px;
    color: #999;
}

.non-existent a,
.non-chat a {
    display: block;
    background: #ee2626;
    width: 130px;
    height: 38px;
    border-radius: 4px;
    text-align: center;
    line-height: 38px;
    margin: 0 auto;
    color: #fff;
    font-size: 14px;
}

.arrondiBox {
    background: #fbfbfd;
}

.loginAlert .bg {
    position: fixed;
    width: 100%;
    height: 100%;
    background: #131820;
    filter: alpha(opacity=60);
    -moz-opacity: 0.6;
    opacity: 0.6;
    left: 0;
    top: 0;
    z-index: 100;
}

.loginAlert .con {
    width: 320px;
    height: 178px;
    border-radius: 8px;
    background: #fff;
    position: fixed;
    top: 50%;
    left: 50%;
    margin: -100px 0 0 -160px;
    z-index: 101;
    text-align: center;
}

.loginAlert a.close {
    display: block;
    width: 30px;
    height: 30px;
    position: absolute;
    top: 5px;
    right: 5px;
    background: url(//style.org.hc360.com/images/chat/icon.png) 10px -510px;
}

.loginAlert h3 {
    font-size: 16px;
    color: #222;
    line-height: 38px;
    padding-top: 40px;
}

.loginAlert p {
    font-size: 12px;
    color: #999;
    line-height: 22px;
    margin-bottom: 20px;
}

.loginAlert a.btn {
    color: #fff;
    margin: 0 auto;
    display: block;
    width: 70px;
    height: 30px;
    border-radius: 5px;
    font-size: 14px;
    line-height: 30px;
    text-align: center;
    background: #ee2626;
}

.loginAlert {
    display: none;
}

.businessCon .classify {
    width: 230px;
    border-radius: 6px;
    border: 1px solid #eaedf3;
}

.classify h3 {
    font-size: 16px;
    color: #222;
    line-height: 48px;
    height: 48px;
    border-bottom: 1px solid #eaedf3;
    font-weight: normal;
    padding: 0 16px;
    background: #f1f1f5;
}

.classify li {
    border-bottom: 1px solid #eaedf3;
    overflow: hidden;
    padding: 1px 16px;
    font-size: 14px;
}

.classify li:last-child {
    border-bottom: 0;
}

.classify li dl {
    overflow: hidden;
}

.classify li dt {
    height: 36px;
    line-height: 36px;
    font-size: 14px;
    padding-left: 28px;
    position: relative;
}

.classify li dt a {
    color: #222;
}

.classify li dt em {
    display: block;
    width: 16px;
    height: 16px;
    left: 0;
    top: 10px;
    position: absolute;
}

.classify li dt em.plus {
    background: url(//style.org.hc360.com/images/chat/icon.png) -184px 0;
}

.classify li dt em.reduce {
    background: url(//style.org.hc360.com/images/chat/icon.png) -184px -31px;
}

.classify li dd {
    display: none;
    padding-left: 38px;
    height: 38px;
    line-height: 38px;
    background: url(//style.org.hc360.com/images/chat/icon.png) -167px -100px no-repeat;
}

.classify li.show dd {
    display: block;
}

.classify li dd a {
    display: block;
    color: #999;
}

.classify li dd:last-child {
    background-position: -167px -138px;
}

.classify li a:hover {
    color: #ed0011;
}

.mallContent .businessList .list {
    height: 325px;
}

.nPermission .prompt {
    height: 90px;
    background: #e8e8e8;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 10;
    font-size: 16px;
    color: #656565;
    text-align: center;
    line-height: 90px;
}

.nPermission .prompt em {
    display: inline-block;
    width: 20px;
    height: 30px;
    vertical-align: middle;
    background: url(//style.org.hc360.com/images/chat/homeIcon.png) -180px -334px no-repeat;
    margin-right: 10px;
}

.nPermission .writingArea {
    display: none;
}

.nPermission .chatCon {
    bottom: 90px;
}

.non-chat .img {
    background: url(//style.org.hc360.com/images/chat/nChatImg.png);
    width: 420px;
    height: 205px;
    margin: 0 auto;
    background-size: 420px 205px;
}

.businessBox:after,
.mallCon:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden
}

// .businessBox,
// .mallCon {
//     *+height: 1%;
// }

.homePageCon {
    padding-left: 70px;
    background: #f0f0f0;
}

.pro-small-img li.cur {
    border: 1px solid #ed0011
}

@media screen and (max-width: 1600px) {
    .chatProList li {
        width: 50%
    }
}

.rigSidebar {
    position: fixed;
    left: auto;
    margin-left: auto;
    right: 20px;
    width: 72px;
    bottom: 160px;
    z-index: 8;
}

.proPrompt {
    padding: 20px 0 61px;
    line-height: 70px;
    text-align: center;
    font-size: 14px;
    color: #999;
}

.chatBox .prompt {
    display: none;
}

.chatBox.nPermission .prompt {
    display: block;
}

.detailIntroduce .con * {
    margin: revert;
    padding: revert;
    list-style-type: revert;
    list-style: revert;
    font-size: revert;
    line-height: revert;
    font-weight: revert;
}

.toolbarRig .navCon.w225 dd {
    border-bottom: 1px solid #e9eaec;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

.toolbarRig .navCon.w225 dd:last-child {
    border-bottom: 0;
    padding-bottom: 0;
    margin-bottom: 0;
}

.toolbarRig .navCon.w225 em {
    left: 16px;
}

.el-icon-warning {
    font-size: 16px;
}

.tradeAreaCon .con .num:before {
    content: '\e678';
    font-family: "iconfont";
    font-size: 12px;
    color: #bbbbbb;
    margin-right: 7px;
}

.user-item a {
    height: 38px;
}

.user-item a:hover .name {
    color: #ed0011;
}

.exhibitionBox .arrondiLeft,
.exhibitionBox .arrondiRig {
    top: 100px;
}

.exhibitionImg {
    height: 100px;
    left: 70px;
    background: url(//style.org.hc360.com/images/chat/zhBanner.jpg) #461185 no-repeat;
}

.exhibitionImg a {
    display: block;
    height: 100px;
}

.list.exhibition .iconType,
.list .product.iconType,
.list .company.iconType,
.list .news.iconType,
.list .tradeArea.iconType,
.list .extension.iconType {
    position: absolute;
    top: 0;
    right: 0;
    width: 32px;
    height: 34px;
}

.list.exhibition .img {
    height: 126px;
    overflow: hidden;
}

.list.exhibition img {
    max-width: 220px;
    max-height: 126px;
}

.list.exhibition .img a {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    height: 126px;
    width: 220px;
}

.list.exhibition .con {
    padding: 0 14px;
    overflow: hidden;
}

.list.exhibition .con .tit {
    font-size: 14px;
    overflow: hidden;
    margin-bottom: 2px;
    word-break: break-all;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    min-height: 42px;
}

.list.exhibition .con .time {
    font-size: 12px;
    white-space: nowrap;
    color: #999;
    margin-bottom: 8px;
    line-height: 16px;
}

.list.exhibition .label {
    height: 20px;
    overflow: hidden;
}

.list.exhibition .label p {
    margin: 0 10px 0 0;
    padding: 0 15px;
    color: #ff9a00;
    line-height: 18px;
    border: 1px solid #ff9a00;
    border-radius: 50px;
    font-size: 12px;
    float: left;
}

.list.exhibition ul {
    margin: 0 -8px 2px;
    padding-top: 4px;
    height: 40px;
}

.list.exhibition li {
    width: 33.333%;
    float: left;
    text-align: center;
    font-size: 12px;
    color: #999;
    line-height: 1;
}

.list.exhibition li.line {
    width: 1px;
    margin: 6px 0 0 -1px;
    background: #eaedf3;
    height: 28px;
}

.list.exhibition li p {
    font-size: 14px;
    color: #656565;
    line-height: 20px;
    height: 20px;
    overflow: hidden;
    padding: 0 5px;
}

.list.exhibition .btn {
    display: block;
    width: 120px;
    height: 25px;
    border-radius: 50px;
    text-align: center;
    line-height: 25px;
    margin: 0 auto;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    letter-spacing: 0px;
    color: #ee2626;
    background-color: rgba(238, 38, 38, 0.1);
    border: solid 1px rgba(238, 38, 38, 0.3);
}

.exhibitionBox .memberBox {
    top: 171px
}

.purchaseCon a:hover,
.tradeAreaCon a.btn:hover,
.list.exhibition .btn:hover {
    opacity: .88;
}

.chatPrompt {
    font-size: 14px;
    text-align: center;
    color: #999;
    padding: 20px 0 10px;
}

.chatPrompt span {
    color: #222;
}

.writingTab li.expression {
    background-position: 15px -1355px;
}

.writingTab li.file {
    background-position: -94px -1354px;
}

.writingTab li.img {
    background-position: -40px -1354px;
}

.writingTab li.expression.cur {
    background-position: 15px -1312px;
    background-color: #f2f2f2;
}

.writingTab li.file.cur {
    background-position: -40px -1312px;
    background-color: #f2f2f2;
}

.writingTab li.img.cur {
    background-position: -94px -1312px;
    background-color: #f2f2f2;
}

.chatCon .con .img {
    position: relative;
    border-radius: 6px;
}

.chatCon .con .img img {
    max-width: 480px;
    border-radius: 6px;
    max-height: 500px;
    min-width: 50px;
    cursor: pointer;
}

.userCard {
    padding: 20px 13px;
    background: #fff;
    border-radius: 6px;
    box-shadow: 0 1px 10px 0 rgba(144, 144, 144, 0.2);
    width: 268px;
    position: absolute;
    left: -24px;
    top: 40px;
    z-index: 5;
}

.userCard:before {
    content: "";
    display: block;
    width: 16px;
    height: 10px;
    position: absolute;
    top: -10px;
    left: 26px;
    background: url(//style.org.hc360.com/images/chat/homeIcon.png) no-repeat -184px -521px;
}

.userCard .tx {
    overflow: hidden;
    border-bottom: 1px solid #eee;
    margin-bottom: 9px;
    padding: 0 7px 15px;
}

.userCard .tx .fl {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    overflow: hidden;
    border: 1px solid rgba(234, 237, 243, 0.6);
    box-sizing: border-box;
}

.userCard .fl .img {
    display: table-cell;
    width: 52px;
    height: 52px;
    text-align: center;
    vertical-align: middle;
}

.userCard .tx .fl img {
    max-width: 52px;
    max-height: 52px;
}

.userCard .tx .fr {
    width: 190px;
    overflow: hidden;
    line-height: 24px;
    padding-top: 2px;
}

.userCard .fr dt {
    overflow: hidden;
    line-height: 24px;
    font-size: 16px;
    color: #222;
}

.userCard .fr dt p {
    float: left;
    margin-right: 8px;
    max-width: 145px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.userCard .fr dt em {
    display: block;
    width: 20px;
    height: 24px;
    float: left;
    background: url(//style.org.hc360.com/images/chat/homeIcon.png) no-repeat;
}

.userCard .fr dt em.women {
    background-position: -188px -480px;
}

.userCard .fr dt em.men {
    background-position: -184px -443px;
}

.userCard .fr dd {
    line-height: 18px;
    font-size: 12px;
    color: #999;
}

.userCard .info {
    overflow: hidden;
    padding: 0 7px;
}

.userCard .info .top {
    overflow: hidden;
    height: 20px;
    line-height: 20px;
    margin-bottom: 15px;
}

.userCard .info .area.fl {
    margin: 0;
    padding-left: 20px;
    font-size: 12px;
    color: #222;
    background: url(//style.org.hc360.com/images/chat/homeIcon.png) no-repeat -188px -545px;
    width: 130px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.userCard .info .label {
    width: 100px;
}

.userCard .info .label span {
    display: block;
    height: 20px;
    padding: 0 12px;
    background: #fbe7e9;
    border-radius: 20px;
    color: #ed0011;
    float: right;
}

.userCard .info ul {
    overflow: hidden;
    padding-bottom: 10px;
}

.userCard .info li {
    margin-bottom: 8px;
    overflow: hidden;
    line-height: 20px;
}

.userCard .info li p.fl {
    margin-right: 0 !important;
    line-height: 20px;
    width: 50px;
    font-size: 12px;
    color: #666;
}

.userCard .info p.fr {
    line-height: 20px;
    width: 204px;
    font-size: 12px;
    color: #222;
}

.userCard .info .conversationBtn {
    display: block;
    font-size: 14px;
    color: #fff;
    background: #ed0011;
    height: 30px;
    line-height: 30px;
    text-align: center;
    border-radius: 6px;
}

.userCard .info p.fr a {
    color: #016eea;
}

.userCard .info p.fr a:hover,
.chatCon .left .con p a:hover,
.chatCon .right .con p a:hover {
    color: #ed0011;
}

.userCard.rightTop:before,
.userCard.rightBot:before {
    width: 10px;
    height: 16px;
    background: url(//style.org.hc360.com/images/chat/homeIcon.png) no-repeat -191px -638px;
    top: 27px;
    left: 294px;
}

.userCard.rightTop,
.userCard.rightBot {
    z-index: 10;
    top: initial;
}

.userCard.rightBot:before {
    top: auto;
    bottom: 30px;
}

.userCon .userCard.bot {
    top: initial;
    bottom: 40px;
}

.userCard.bot:before {
    top: auto;
    bottom: -8px;
    background: url(//style.org.hc360.com/images/chat/homeIcon.png) no-repeat -184px -585px;
}

.chatCon .left .con p a,
.chatCon .right .con p a {
    color: #016eea;
    word-break: break-all;
}

.chatTit .fl {
    position: absolute;
    top: 16px;
    left: 80px;
}

.chatTit .fl dt {
    overflow: hidden;
    line-height: 20px;
    height: 20px;
    margin-bottom: 4px;
}

.chatTit .fl h4 {
    float: left;
    font-size: 18px;
    color: #222;
}

.chatTit .fl p {
    color: #666;
    font-size: 14px;
    border-left: 1px solid #d9d9d9;
    margin: 2px 0 0 19px;
    padding-left: 16px;
    line-height: 16px;
}

.chatTit .fl dd {
    height: 18px;
    overflow: hidden;
    font-size: 12px;
    color: #999;
    line-height: 18px;
}

.chatTit .fl p.assistant {
    color: #222;
    font-size: 18px;
    border-left: 0;
    margin: 0;
    padding-left: 0;
    line-height: 38px;
}

.chatCon .con p {
    word-break: break-all;
}

li.expression .con {
    padding: 10px;
    background: #fff;
    border-radius: 6px;
    box-shadow: 0 1px 10px 0 rgba(144, 144, 144, 0.2);
    width: 420px;
    position: absolute;
    left: -9px;
    bottom: 68px;
}

li.expression .con:before {
    content: "";
    bottom: -8px;
    background: url(//style.org.hc360.com/images/chat/homeIcon.png) no-repeat -184px -585px;
    display: block;
    width: 16px;
    height: 10px;
    position: absolute;
    left: 30px;
}

li.expression .con dd {
    width: 20px;
    height: 20px;
    margin: 5px 5px;
    float: left;
    font-size: 20px;
    line-height: 20px;
}

.nPermission .prompt2 {
    height: 48px;
    background: #e8e8e8;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 10;
    font-size: 16px;
    color: #656565;
    text-align: center;
    line-height: 24px;
    padding: 21px 0;
}

.nPermission .prompt2 em {
    display: inline-block;
    width: 20px;
    height: 30px;
    vertical-align: middle;
    background: url(//style.org.hc360.com/images/chat/homeIcon.png) -180px -334px no-repeat;
    margin-right: 10px;
}

.nPermission .prompt2 a {
    color: #016eea;
}

.chatListCon dd img.emoji {
    width: 14px;
    height: 14px;
    vertical-align: top;
}

li.expression .con dd img {
    width: 100%;
    height: 100%;
    vertical-align: top;
}

.chatCon .con p img.emoji {
    width: 20px;
    height: 20px;
    font-size: 20px;
}

img.emoji {
    font-size: 24px;
}

#_tipsdom {
    left: 68px !important;
}

.commodityBox::-webkit-scrollbar,
.arrondiCon::-webkit-scrollbar,
.arrondiRig::-webkit-scrollbar,
.preview .con::-webkit-scrollbar,
.fileAlert .content::-webkit-scrollbar {
    width: 4px
}

.commodityBox::-webkit-scrollbar-track,
.serviceBox::-webkit-scrollbar-track,
.arrondiCon::-webkit-scrollbar-track,
.arrondiRig::-webkit-scrollbar-track,
.preview .con::-webkit-scrollbar-track,
.fileAlert .content::-webkit-scrollbar-track {
    background: #fff;
    -webkit-border-radius: 2em;
    -moz-border-radius: 2em;
    border-radius: 2em
}

.commodityBox::-webkit-scrollbar-thumb,
.serviceBox::-webkit-scrollbar-thumb,
.arrondiCon::-webkit-scrollbar-thumb,
.arrondiRig::-webkit-scrollbar-thumb,
.fileAlert .content::-webkit-scrollbar-thumb,
.preview .con::-webkit-scrollbar-thumb {
    background: #b7b7b7;
    -webkit-border-radius: 2em;
    -moz-border-radius: 2em;
    border-radius: 2em
}

body::-webkit-scrollbar,
.arrondiBox::-webkit-scrollbar,
.serviceBox::-webkit-scrollbar {
    width: 8px
}

body::-webkit-scrollbar-track,
.arrondiBox::-webkit-scrollbar-track {
    background: #fff;
    -webkit-border-radius: 2em;
    -moz-border-radius: 2em;
    border-radius: 2em
}

body::-webkit-scrollbar-thumb,
.arrondiBox::-webkit-scrollbar-thumb {
    background: #b7b7b7;
    -webkit-border-radius: 2em;
    -moz-border-radius: 2em;
    border-radius: 2em
}

.left .fileBox {
    float: left;
}

.right .fileBox {
    float: right;
}

.fileCon {
    margin-bottom: 16px;
    position: relative;
}

.fileCon .file {
    padding: 11px;
    background: #fff;
    border-radius: 5px;
    border: 1px solid #eaedf3;
    width: 240px;
    overflow: hidden;
    float: right;
    position: relative;
}

.fileCon .file a {
    position: relative;
    z-index: 2;
}

.file .fl {
    width: 182px;
}

.file .fl p.tit {
    font-size: 14px;
    line-height: 20px;
    color: #222;
    margin-bottom: 6px;
    word-break: break-word;
}

.file .fl p.size {
    line-height: 14px;
    color: #999;
    font-size: 12px;
}

.file .fr {
    width: 40px;
    height: 40px;
}

.file .fr em {
    display: block;
    width: 40px;
    height: 40px;
    background: url(//style.org.hc360.com/images/chat/fileIcon.png) no-repeat 0 -332px;
}

.file .fr em.rar {
    background-position: 0 0;
}

.file .fr em.doc,
.file .fr em.docx {
    background-position: 0 -200px;
}

.file .fr em.pdf {
    background-position: 0 -120px;
}

.file .fr em.ppt,
.file .fr em.pptx {
    background-position: 0 -40px;
}

.file .fr em.xls,
.file .fr em.xlsx {
    background-position: 0 -80px;
}

.file .fr em.img {
    background-position: 0 -240px;
    padding: 0;
}

.file .fr em.zip {
    background-position: 0 -160px;
}

.file .fr em.nomatch {
    background-position: 0 -332px;
}

a.down {
    display: block;
    width: 22px;
    height: 22px;
    background: url(//style.org.hc360.com/images/chat/fileIcon.png) -46px -48px no-repeat;
    float: left;
    position: absolute;
    left: -34px;
    top: 50%;
    margin-top: -11px;
}

a.fail {
    display: block;
    width: 22px;
    height: 22px;
    background: url(//style.org.hc360.com/images/chat/fileIcon.png) -46px 0 no-repeat;
    float: left;
    position: absolute;
    left: -34px;
    top: 50%;
    margin-top: -11px;
}

a.stop {
    display: block;
    width: 22px;
    height: 22px;
    background: url(//style.org.hc360.com/images/chat/fileIcon.png) -46px -24px no-repeat;
    float: left;
    position: absolute;
    left: -34px;
    top: 50%;
    margin-top: -11px;
}

.fileCon:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden
}

.progress {
    position: absolute;
    background: #a7d7ff;
    top: 0;
    left: 0;
    height: 100%;
    z-index: 0;
}

.left a.down,
.left a.fail,
.left a.stop,
.left .fileCon a.loading {
    left: auto;
    right: -34px;
}

.fileAlert {
    display: none;
}

.fileAlert .bg {
    position: fixed;
    width: 100%;
    height: 100%;
    background: #131820;
    filter: alpha(opacity=60);
    -moz-opacity: 0.6;
    opacity: 0.6;
    left: 0;
    top: 0;
    z-index: 100;
}

.fileAlert .con {
    width: 270px;
    border-radius: 8px;
    background: #fff;
    position: fixed;
    top: 50%;
    left: 50%;
    margin: -180px 0 0 -160px;
    z-index: 101;
    padding: 15px 24px 20px;
}

.fileAlert a.close {
    display: block;
    width: 30px;
    height: 30px;
    position: absolute;
    top: 7px;
    right: 10px;
    background: url(//style.org.hc360.com/images/chat/icon.png) 10px -510px;
}

.fileAlert .title {
    font-size: 16px;
    color: #222;
    line-height: 44px;
    padding: 0 22px;
    border-bottom: 1px solid #eaedf3;
    margin: -15px -24px 20px;
    text-align: left;
}

.fileAlert .title h3 {
    float: left;
}

.fileAlert .title span {
    font-size: 14px;
    color: #666;
}

.fileAlert .file {
    padding: 11px;
    background: #fff;
    border-radius: 5px;
    border: 1px solid #eaedf3;
    width: 240px;
    overflow: hidden;
    position: relative;
    margin: 0 auto 10px;
}

.fileAlert .file a {
    position: relative;
    z-index: 2;
}

.fileAlert .btn {
    text-align: center;
    padding-top: 10px;
}

.fileAlert .btn a {
    display: inline-block;
    width: 70px;
    height: 30px;
    border-radius: 5px;
    font-size: 14px;
    line-height: 30px;
    text-align: center;
    background: #ee2626;
    margin: 0 10px;
    color: #fff;
}

.fileAlert .btn a.cancel {
    background: #eaedf3;
    color: #666;
}

.fileCon a.loading {
    display: block;
    width: 22px;
    height: 22px;
    background: url(//style.org.hc360.com/images/chat/loading28.gif) 0 0 no-repeat;
    background-size: 22px 22px;
    float: left;
    position: absolute;
    left: -34px;
    top: 50%;
    margin-top: -11px;
}

.imgLoading {
    position: absolute;
    top: 0;
    height: 100%;
    width: 100%;
    background: rgba(0, 0, 0, 0.5);
    border-radius: 6px;
}

.imgLoading:after {
    content: "";
    display: block;
    width: 50px;
    height: 40px;
    position: absolute;
    left: 50%;
    margin-left: -25px;
    top: 50%;
    margin-top: -20px;
    background: url(//style.org.hc360.com/images/homepage/2020/loading.gif) -5px 0px;
    opacity: 0.95;
    border-radius: 6px;
}

.chatCon .left .con.imgCon,
.chatCon .right .con.imgCon {
    padding: 0;
    background: none;
    border: 0;
    border-radius: 5px;
    margin-bottom: 20px;
    position: relative;
    clear: both;
}

.preview {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 50;
    display: none;
}

.preview .bg {
    position: fixed;
    top: 0;
    height: 100%;
    width: 100%;
    background: #000;
    border-radius: 0;
    opacity: 0.6;
}

.fileAlert .content {
    overflow: auto;
    width: 270px;
    max-height: 240px;
    padding-right: 10px;
}

.preview .con {
    max-height: 800px;
    max-width: 700px;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    overflow: auto;
}

.preview .con img {
    max-height: none;
    max-width: 700px;
    position: static;
    transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    -webkit-transform: translate(0, 0);
    -o-transform: translate(0, 0);
}

.preview .con img {
    max-width: 700px;
}

.navTitle.nArrow a {
    background: none;
}

.topStandardIcon .icon {
    font-size: 20px;
    width: 32px;
    height: 34px;
}

.businessList .list em.label,
.businessList .list em.topStandardIcon {
    position: absolute;
    right: 28px;
}

.businessCon .industryTit {
    position: relative;
    height: 36px;
    padding: 21px 0 28px;
    z-index: 6;
    overflow: hidden;
}

.industryTit li {
    z-index: 6;
    float: left;
    height: 36px;
    font-size: 16px;
    margin-bottom: 30px;
}

.industryTit li p,
.industryTit li a {
    position: relative;
    display: block;
    height: 36px;
    margin: 0 12px 0 0;
    color: #999;
    text-align: center;
    line-height: 36px;
    cursor: pointer;
    z-index: 7;
    padding: 0 20px;
}

.industryTit li.current p,
.industryTit li.current a {
    display: block;
    background: #ee2626;
    border-radius: 50px;
    color: #fff;
    transition: .3s;
}

.industryTit li.current p,
.industryTit li.current a::before {
    color: #fff;
}

.industryTit p:after {
    content: "";
    display: none;
    position: absolute;
    top: 36px;
    left: 50%;
    width: 23px;
    height: 11px;
    margin: 8px auto 0 -12px;
    background: url(//style.org.hc360.com/images/Nindex/news2019/icon.png) 6px -222px;
    z-index: 6;
}

.industryTit p:hover,
.industryTit td a:hover {
    color: #ee2626;
}

.industryTit td {
    padding: 8px 20px 12px;
    vertical-align: top;
}

.industryTit h3 {
    font-size: 16px;
    color: #222;
    line-height: 40px;
}

.industryTit td a {
    float: left;
    font-size: 14px;
    color: #999;
    margin-right: 18px;
    line-height: 26px;
}

.industryTit .con {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    top: 66px;
    z-index: 6;
    width: 1160px;
    padding: 15px 20px 20px;
    background: #fff;
    box-shadow: 0 0 10px #e3e3e3;
    border-radius: 6px;
}

.industryTit li.current .con {
    display: block;
    transition: .3;
}

.industryTit .link {
    width: 530px;
}

.industryTit .all p:before,
.industryTit .hot p:before,
.industryTit .hot a:before {
    content: "\e676";
    color: #ed0212;
    font-family: "iconfont";
    display: inline-block;
    font-size: 18px;
}

.industryTit .current p:before {
    color: #fff;
}


.industryTit .con .tabTitle {
    position: absolute;
    right: 0;
    top: 0;
    padding: 10px 0;
    z-index: 8;
    width: 208px;
    background: #fff;
    text-align: center;
    border-left: 1px solid #efeff1;
    bottom: 0;
    font-size: 14px;
    color: #222;
    line-height: 38px;
}

.industryTit .con:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden
}

.industryTit .all .list {
    height: 300px;
}

.industryTit .all dd {
    cursor: pointer;
}

.industryTit .all dd:hover {
    color: #f63521;
}

.industryTit .all dd.current {
    background: #ffe0dd;
    color: #f63521;
    font-weight: bold;
}

.industryTit li.all .list {
    width: 910px;
    display: none;
}

.industryTit li.all .link {
    width: 430px;
}

.businessCon .industryTit ul {
    width: 102%;
}

@media screen and (max-width: 1280px) {
    body {
        overflow: auto;
    }

    .w1170,
    .toolbarCon,
    .businessBox {
        width: 1000px;
    }

    .chatProList li {
        width: 50%
    }

    .industryTit li p,
    .industryTit li a {
        padding: 0 19px;
        margin: 0 15px 0 0;
    }
}

.businessList .list {
    overflow: inherit;
    margin: 0 14px 14px 0;
}

.list.exhibition .img,
.list.product .img,
.list.product .img {
    width: 158px;
    height: 158px;
    margin: auto;
    line-height: 158px;
    border-radius: 6px 6px 0 0;
    overflow: hidden;
}

.list.product .img {
    margin: 10px auto 28px;
}

.contactCon {
    border-radius: 0 0 6px 6px;
    overflow: hidden;
}

.homePageCon .businessCon .title {
    display: none;
}

.sendSession {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 2;
    text-align: center;
    background-image: linear-gradient(-180deg, #e8e8e800 0%, rgb(234 237 243 / 0%) 10%);
    background-color: #fff;
    opacity: 0;
    filter: Alpha(opacity=0);
    border-radius: 6px;
}

.sendSession img {
    position: relative;
    width: 38px;
    height: 38px;
    border-radius: 19px;
    vertical-align: middle;
    border: solid 1px rgba(76, 73, 72, 0.38);
}

.sendSession .hea {
    position: relative;
}

.sendSession .hea em {
    position: absolute;
    bottom: 0;
    content: '';
    width: 8px;
    height: 8px;
    margin-left: -10px;
    border: solid 2px #ffffff;
    border-radius: 50%;
    border: 2px solid #fff;
    background: #cbcccf;
}

.sendSession .hea em.onLinetstatus {
    background: #01ca3e;
}

.sendSession .btn {
    display: block;
    border-radius: 50px;
    text-align: center;
    margin: 18px auto 15px;
    color: #fff;
    font-size: 14px;
    width: 120px;
    height: 25px;
    background-color: #6e6363;
    border-radius: 13px;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    line-height: 25px;
}

.sendSession span {
    padding: 7px;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    color: #fff;
}

.sendSession .iconSession::after {
    content: '\e677';
    font-size: 14px;
    color: #fff;
    font-family: "iconfont";
}

.businessList .list.serviceShow .icon {
    visibility: inherit;
}

.list.serviceShow {
    border-radius: 6px;
    box-shadow: 0px 0px 4px 0px rgba(133, 128, 128, 0.9);
}

.list.serviceShow .sendSession {
    opacity: 0.9;
    animation-name: slide;
    animation-duration: .5s;
    animation-timing-function: ease-in;
}

.list.serviceShow .contactBtn {
    position: absolute;
    height: 50px;
    top: 0;
}

@keyframes slide {
    0% {
        opacity: 0.6;
    }

    50% {
        opacity: 0.8;
    }

    100% {
        opacity: 0.9;
    }
}

.js-mask-main {
    max-height: 705px !important;
    height: 80%;
    padding: 1em 0 !important;
    box-sizing: border-box;
    padding-top: 100px !important;
}

.topAdImg {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

.js-mask-main .main-con {
    text-align: justify !important;
    max-height: none !important;
    box-sizing: border-box;
    height: 100% !important;
    margin: 0 auto !important;
}

.js-mask-main .main-title {
    position: absolute !important;
    top: 50px !important;
    width: 100% !important;
    padding-top: 0px !important;
}

.navCon2020.w225 {
    width: 240px;
}

.navCon2020.w180 {
    width: 240px;
}

.navCon2020 dd h3 {
    font-size: 14px;
    color: #333;
    line-height: 30px;
    margin: 0;
    padding: 0;
}

.navCon2020 dd a {
    display: block;
    float: left;
    font-size: 12px;
    color: #959595;
    line-height: 26px;
    margin-right: 12px
}

.navCon2020 em {
    display: block;
    position: absolute;
    top: -5px;
    left: 18px;
    background: url(https://style.org.hc360.com/images/Nindex/news2019/icon.png) 0 -223px;
    width: 13px;
    height: 6px;
}

.purchaselist a {
    line-height: 30px;
    color: #d94536;
    padding-right: 22px;
    position: relative;
    display: block;
    height: 30px;
    float: left
}

.purchaselist a span {
    display: inline-block;
    position: absolute;
    top: 9px;
    left: 40px;
    color: #fff;
    height: 12px;
    padding: 0 5px;
    border-radius: 5px;
    background: #d94536;
    line-height: 12px
}

.navCon2020.kf {
    width: 94px;
    padding: 20px 0;
    text-align: center;
    left: 3px
}

.navCon2020.kf em {
    left: 40px
}

.navCon2020.kf dd {
    border: 0;
    text-align: center;
    padding: 0;
    margin: 0
}

.navCon2020.kf dd a {
    display: block;
    float: none;
    margin: 0;
    line-height: 30px;
    font-size: 14px;
    color: #282828
}

.navCon2020 dd a:hover,
.toolbarLeft a:hover {
    color: #d94536
}

.navCon2020.siteMap {
    width: 480px;
    right: -87px;
    left: auto
}

.navCon2020.siteMap em {
    right: 118px;
    left: auto;
}

.navCon2020.siteMap h3 {
    display: block;
}

.navCon2020.siteMap .sitemapLink {
    padding-bottom: 10px;
    border-bottom: 1px solid #e9eaec;
    overflow: hidden;
}

.navCon2020.iphone {
    width: 223px;
    left: auto;
    right: 0;
    padding: 20px 10px 15px;
}

.navCon2020.iphone dd {
    float: left;
    padding: 0;
    margin: 0;
}

.navCon2020.iphone dd .navCodeImg {
    border: 1px solid #e9eaec
}

.navCon2020.iphone dd p {
    color: #222;
    text-align: center;
    padding: 10px 0;
    font-size: 12px;
}

.navCon2020.iphone em {
    left: auto;
    right: 32px;
}

.unitBox ul {
    position: absolute;
    top: 38px;
    left: -1px;
    background: #f3f3f4;
    line-height: 24px;
    color: #959595;
    display: none;
    width: 72px
}

.unitBox ul li {
    height: 28px;
    padding: 0 8px;
    width: 56px;
    cursor: pointer
}

.unitBox ul li:hover {
    background: #d8d9db
}

.navCon2020.iphone .fl {
    padding: 2px 7px 0;
    width: 107px;
    float: left;
}

.navCon2020.iphone .fl p {
    margin: 0 0 8px;
    height: 14px;
    padding: 2px 0 0 10px;
    text-align: left;
    border-left: 3px solid #fff;
    line-height: 14px;
    cursor: pointer;
}

.navCon2020.iphone .fr .codeImg {
    width: 95px;
    height: 95px;
    display: none;
    border: 1px solid #f1f1f3;
    position: inherit;
}

.navCon2020.iphone .fl p.cur {
    color: #ed0011;
    border-left: 3px solid #ed0011;
    font-size: 14px;
    background: none;
}

.navCon2020.iphone .fr .codeImg img {
    width: 95px;
}

.navCon2020.iphone .fl p:hover {
    color: #ed0011;
    font-size: 14px;
}

.navCon2020.iphone .fr {
    float: right;
    padding-top: 25px;
}

.navTitle .home {
    background: none;
    padding: 0;
}

.toolbarRig ul li:nth-child(4) .navCon2020.w180 {
    width: 180px;
}